Results 1 to 7 of 7

Thread: random image and autosize

  1. #1
    Join Date
    Jan 2014
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default random image and autosize

    How to combine two scripts?
    (on page load opens a random image autosize that have link)

    Code:
    <script language="JavaScript">
    <!--
    
    function random_imglink(){
    var myimages=new Array()
    //specify random images below. You can have as many as you wish
    myimages[1]="01.jpg"
    myimages[2]="02.jpg"
    myimages[3]="03.jpg"
    myimages[4]="04.jpg"
    myimages[5]="05.jpg"
    myimages[6]="06.jpg"
    myimages[7]="07.jpg"
    myimages[8]="08.jpg"
    myimages[9]="09.jpg"
    myimages[10]="10.jpg"
    
    
    var ry=Math.floor(Math.random()*myimages.length)
    if (ry==0)
    ry=1
    document.write('<img src="'+myimages[ry]+'" border=0>')
    }
    random_imglink()
    //-->
    </script>

    image auto size:
    Code:
    <html>
    <head>
    <title>Start</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <style type="text/css">
    img.small{width:300px;}
    img.large{width:100%;}
    </style>
    <script type="text/javascript">
    window.onload = function()
    {
    	var obj=document.getElementById('wrap').getElementsByTagName('img');
    	for(var start=0;start<obj.length;start++)
    		{obj[start].onclick=function() 
    			{this.className = (this.className != 'small')? 'small': 'large';}
    		}
    }
    </script>
    </head>
    <body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0">
    <div id="wrap">
    <img src="02.jpg" class="large" width="160" height="156"></div>
    </body>
    </html>

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,070
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    Have you tried it? It looks like it would work:

    Code:
    <html>
    <head>
    <title>Start</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <style type="text/css">
    img.small{width:300px;}
    img.large{width:100%;}
    </style>
    <script type="text/javascript">
    window.onload = function()
    {
    	var obj=document.getElementById('wrap').getElementsByTagName('img');
    	for(var start=0;start<obj.length;start++)
    		{obj[start].onclick=function() 
    			{this.className = (this.className != 'small')? 'small': 'large';}
    		}
    }
    </script>
    </head>
    <body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0">
    <div id="wrap">
    <img src="02.jpg" class="large" width="160" height="156"><br>
    <script language="JavaScript">
    <!--
    
    function random_imglink(){
    var myimages=new Array()
    //specify random images below. You can have as many as you wish
    myimages[1]="01.jpg"
    myimages[2]="02.jpg"
    myimages[3]="03.jpg"
    myimages[4]="04.jpg"
    myimages[5]="05.jpg"
    myimages[6]="06.jpg"
    myimages[7]="07.jpg"
    myimages[8]="08.jpg"
    myimages[9]="09.jpg"
    myimages[10]="10.jpg"
    
    
    var ry=Math.floor(Math.random()*myimages.length)
    if (ry==0)
    ry=1
    document.write('<img class="large" src="'+myimages[ry]+'" border=0>')
    }
    random_imglink()
    //-->
    </script>
    </div>
    </body>
    </html>
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Jan 2014
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    almost ok
    I made a small change.
    the pictures still missing links

    Code:
            <html>
            <head>
            <title>Start</title>
            <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
            <style type="text/css">
            img.small{width:300px;}
            img.large{width:100%;}
            </style>
            <script type="text/javascript">
            window.onload = function()
            {
            	var obj=document.getElementById('wrap').getElementsByTagName('img');
            	for(var start=0;start<obj.length;start++)
            		{obj[start].onclick=function() 
            			{this.className = (this.className != 'small')? 'small': 'large';}
            		}
            }
            </script>
            </head>
            <body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0">
            <div id="wrap">
                    <script language="JavaScript">
            <!--
    
            function random_imglink(){
            var myimages=new Array()
            //specify random images below. You can have as many as you wish
            myimages[1]="01.jpg"
            myimages[2]="02.jpg"
            myimages[3]="03.jpg"
            myimages[4]="04.jpg"
            myimages[5]="05.jpg"
            myimages[6]="06.jpg"
            myimages[7]="07.jpg"
            myimages[8]="08.jpg"
            myimages[9]="09.jpg"
            myimages[10]="10.jpg"
    
    
            var ry=Math.floor(Math.random()*myimages.length)
            if (ry==0)
            ry=1
            document.write('<img class="large" src="'+myimages[ry]+'" border=0>')
            }
            random_imglink()
            //-->
            </script>
            </div>
            </body>
            </html>
    Last edited by jscheuer1; 01-20-2014 at 02:00 AM. Reason: Format

  4. #4
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,070
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    the pictures still missing links
    Which links?
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  5. #5
    Join Date
    Jan 2014
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    something like that

    ......
    myimages[4]="04.jpg"
    myimages[5]="05.jpg"
    myimages[6]="06.jpg"
    myimages[7]="07.jpg"
    .......

    <p><a href="04.htm" target="sisu"><img src="04.jpg"></a></p>
    <p><a href="05.htm" target="sisu"><img src="05.jpg"></a></p>
    <p><a href="06.htm" target="sisu"><img src="06.jpg"></a></p>
    <p><a href="07.htm" target="sisu"><img src="07.jpg"></a></p>

  6. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,070
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    Code:
            <html>
            <head>
            <title>Start</title>
            <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
            <style type="text/css">
            img.small{width:300px;}
            img.large{width:100%;}
            </style>
            <script type="text/javascript">
            window.onload = function()
            {
            	var obj=document.getElementById('wrap').getElementsByTagName('img');
            	for(var start=0;start<obj.length;start++)
            		{obj[start].onclick=function() 
            			{this.className = (this.className != 'small')? 'small': 'large';}
            		}
            }
            </script>
            </head>
            <body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0">
            <div id="wrap">
                    <script>
    
            function random_imglink(){
            var myimages = [];
            //specify random images below. You can have as many as you wish
            myimages[0]={img: "01.jpg", link: "01.htm"}
            myimages[1]={img: "02.jpg", link: "02.htm"}
            myimages[2]={img: "03.jpg", link: "03.htm"}
            myimages[3]={img: "04.jpg", link: "04.htm"}
            myimages[4]={img: "05.jpg", link: "05.htm"}
            myimages[5]={img: "06.jpg", link: "06.htm"}
            myimages[6]={img: "07.jpg", link: "07.htm"}
            myimages[7]={img: "08.jpg", link: "08.htm"}
            myimages[8]={img: "09.jpg", link: "09.htm"}
            myimages[9]={img: "10.jpg", link: "10.htm"}
    
    
            var ry=Math.floor(Math.random()*myimages.length)
    
            document.write('<a href="'+myimages[ry].link+'" target="sisu"><img class="large" src="'+myimages[ry].img+'" border=0></a>')
            }
            random_imglink()
    
            </script>
            </div>
            </body>
            </html>
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  7. #7
    Join Date
    Jan 2014
    Posts
    7
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    the code works!
    thanks
    (code is a tiny part of one NGO project)

Similar Threads

  1. looking for php random image plus random alt from folder script
    By Marquis in forum Looking for such a script or service
    Replies: 0
    Last Post: 01-05-2009, 06:31 PM
  2. Resolved random image plus random alt from folder
    By Marquis in forum PHP
    Replies: 1
    Last Post: 01-05-2009, 06:29 PM
  3. Replies: 0
    Last Post: 02-05-2008, 07:48 AM
  4. Replies: 2
    Last Post: 03-28-2006, 09:28 AM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •