Results 1 to 4 of 4

Thread: HTML5 help

  1. #1
    Join Date
    Oct 2010
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy HTML5 help

    Ok basically im trying to make this http://www.dynamicdrive.com/dynamici...nslideshow.htm but what i want it todo is be a list of about 4 or 5 of these that would show pictures of the featured post of my forum. i would put the images in manually but i dont know how to make them click able and able to go to the post i specify it to go to and how would i get them into a box where they look neat and just click able all this would go on the portal of my forum im trying to explain it the best i can

  2. #2
    Join Date
    Oct 2006
    Location
    New York, NY, USA
    Posts
    245
    Thanks
    39
    Thanked 24 Times in 24 Posts

    Default Something like this?

    I'm not good enough to do this myself, but here is JavaScriptKit code from http://www.jacquimorgan.com/ that adds link to array.

    Code:
     
    /* Flexible Image Slideshow- By JavaScriptKit.com (http://www.javascriptkit.com)
     For this and over 400+ free scripts, visit JavaScript Kit- http://www.javascriptkit.com/  This notice must stay intact for use */
     /*see forum http://www.codingforums.com/showthread.php?t=143543  for adding caption/title August08 and onMouseOver PAUSE Aug08*/
    
    var ultishow=new Array()
    
    //ultishow[x]=["path to image", "OPTIONAL image link", "OPTIONAL target", "caption/Title"]
    ultishow[0]=['miscImages/mostlyNude.jpg', 'life/index.html', '', 'Book Cover']
    ultishow[1]=['book300/page23.jpg', 'life/index.html', '', 'Page 23 Darlene and Pinky 2007 16x18']
    ultishow[2]=['book300/page25.jpg', 'life/index.html', '', 'Page 25 Kika Hiding from the Spotlight 2009 22x15']
    ultishow[3]=['book300/page27.jpg', 'life/index.html', '', 'Page 27 A Quiet Moment 2008 11x14']
    ultishow[4]=['book300/page29.jpg', 'life/index.html', '', 'Page 29 Dauphine	2007 11x15']
    <!--ultishow[5]=['still/43SantaAnaVineyard.jpg', 'other/index.html', '', 'Santa Ana Vineyard New Year Card'] -->
    
    //configure below 3 variables to set the dimension/background color of slideshow
    var slidewidth="500px" //set to width of LARGEST image in slideshow
    var slideheight="525px" //set to height of LARGEST iamge in slideshow
    var slidecycles="3" //number of cycles before slideshow stops (ie: "2" or "continous")
    var randomorder="yes" //randomize order in which images are displayed? "yes" or "no"
    var preloadimages="yes" //preload images? "yes" or "no"
    var slidebgcolor='transparent'
    //configure below variable to determine delay between image rotations (in miliseconds)
    var slidedelay=3000
    var timer=null //for PAUSE
    
    ////Do not edit pass this line////////////////
    var ie=document.all
    var dom=document.getElementById
    var curcycle=0
    
    if (preloadimages=="yes"){
    for (i=0;i<ultishow.length;i++){
    var cacheimage=new Image()
    cacheimage.src=ultishow[i][0]
    }
    }
    
    var currentslide=0
    
    function randomize(targetarray){
    ultishowCopy=new Array()
    var the_one
    var z=0
    while (z<targetarray.length){
    the_one=Math.floor(Math.random()*targetarray.length)
    if (targetarray[the_one]!="_selected!"){
    ultishowCopy[z]=targetarray[the_one]
    targetarray[the_one]="_selected!"
    z++
    }
    }
    }
    
    if (randomorder=="yes")
    randomize(ultishow)
    else
    ultishowCopy=ultishow
    
    function rotateimages(){
    curcycle=(currentslide==0)? curcycle+1 : curcycle
    ultcontainer='<center>'
    
    if (ultishowCopy[currentslide][1]!="")
    ultcontainer+='<a href="'+ultishowCopy[currentslide][1]+'" target="'+ultishowCopy[currentslide][2]+'">'
    ultcontainer+='<img src="'+ultishowCopy[currentslide][0]+'" border="0" onmouseover="clearTimeout(timer)" onmouseout="rotateimages()">' //timer for PAUSE>'
    if (ultishowCopy[currentslide][1]!="")
    ultcontainer+='</a>'
    
    if(ultishowCopy[currentslide][3]){
    ultcontainer+='<p>'+ultishowCopy[currentslide][3]+'</p>'
    }/*see August08 forum http://www.codingforums.com/showthread.php?t=143543  */
    
    ultcontainer+='</center>'
    
    if (ie||dom)
    crossrotateobj.innerHTML=ultcontainer
    if (currentslide==ultishow.length-1) currentslide=0
    else currentslide++
    if (curcycle==parseInt(slidecycles) && currentslide==0)
    return
    timer=setTimeout("rotateimages()",slidedelay)
    }
    
    if (ie||dom)
    document.write('<div id="slidedom" style="width:'+slidewidth+';height:'+slideheight+'; background-color:'+slidebgcolor+'"></div>')
    
    function start_slider(){
    crossrotateobj=dom? document.getElementById("slidedom") : document.all.slidedom
    rotateimages()
    }
    
    if (ie||dom)
    window.onload=start_slider
    Last edited by auntnini; 06-23-2011 at 01:35 AM. Reason: error

  3. #3
    Join Date
    Oct 2006
    Location
    New York, NY, USA
    Posts
    245
    Thanks
    39
    Thanked 24 Times in 24 Posts

    Default try DD Scripts forum category

    I think you query should go under "DD Scripts
    -- Dynamic Drive scripts help"

  4. #4
    Join Date
    Jun 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    thanks. I learned a lot to your post.

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
  •