rotating images

This is my code below. I LOVE everything about it, border and all.

However, this only randomly changes when I reload the page.

Is there a way I can make it so that the images keep rotating when I'm on the page instead of it randomly changing everytime I reload?

I would like to keep the border and size and all.

I REALLY NEED HELP!!!! THANK YOU SO MUCH IN ADVANCE!

Code:

---

<script type="text/javascript">
/*********Edit values here for your pictures*******************/
var
pic1='https://store-a32dc.mybigcommerce.com/product_images/uploaded_images/MOMSHOPPING2.gif',
pic2='https://store-a32dc.mybigcommerce.com/product_images/uploaded_images/RRR.gif',
pic3='https://store-a32dc.mybigcommerce.com/product_images/uploaded_images/2photos.jpg';
/***************End of Edit*********************************/

var rangPics=[pic1,pic2,pic3]; // Add all the picture variables in this array.
window.onload=function() { rangRandom=Math.floor(Math.random()*rangPics.length);
document.getElementById('show').innerHTML='<img src="'+rangPics[rangRandom]+'" alt="myimage" style="width:950px;height:450px;">';}</script>
<div id="show" style="text-align:center;width:950px;border:3px double #222;padding:10px;"></div>

---

Code:

---

<script type="text/javascript">
window.onload = function() {
        /*********Edit values here for your pictures*******************/
        var
        pic1='https://store-a32dc.mybigcommerce.com/product_images/uploaded_images/MOMSHOPPING2.gif',
        pic2='https://store-a32dc.mybigcommerce.com/product_images/uploaded_images/RRR.gif',
        pic3='https://store-a32dc.mybigcommerce.com/product_images/uploaded_images/2photos.jpg';

        var rangPics = [pic1, pic2, pic3]; // Add all the picture variables to this array.
        var pause = 3000; // milliseconds pause between images
       
        /***************End of Edit*********************************/

        var pl, rangRandom = Math.floor(Math.random() * (pl = rangPics.length));
        function loadpic() {
                document.getElementById('show').innerHTML = '<img src="' + rangPics[rangRandom] + '" alt="myimage" style="width:950px;height:450px;">';
        }
        loadpic();
        setInterval(function(){
                rangRandom = ++rangRandom % pl;
                loadpic();
        }, pause);
};
</script>
<div id="show" style="text-align:center;width:950px;border:3px double #222;padding:10px;"></div>

---