Pure Software code
 

      Read me ...
 

    

Free Training Programming Courses On Line  -  www.puresoftwarecode.com
 
www.puresoftwarecode.com        
 
           Pictures move vertical, Up down slideshow (collection of pictures stored at folder: pictures_move_vertical_files)
 
 
    Add the following points to web page

Notes    

1.
  • at Normal Source of web page, right click the specific cell, on the shortcut menu click Cell Proprieties, the Cell Proprieties dialog box appears, select the  Horizontal alignment combo box to value Center,  and then click ok

  • at Normal Source, into  this cell,  type 'A' and  select it
  • at HTML source, appears the place selected at the previous point ( letter 'A' typed and selected at Normal Source)
    <TD width="33%" align="center">A</TD>
  • at HTML source, replace previous HTML text (<TD width="33%" align="center">A</TD>) by the  following HTML text, (color of old text - red, color of new text - black)

    <TD width="33%" align="center">


    <SCRIPT language=JavaScript1.2>

    /*
    Pictures move vertical, Up down slideshow Script

    */

    ///////configure the below four variables to change the style of the slider///////

    //set the scrollerwidth and scrollerheight to the width/height of the LARGEST image in your slideshow!

    var scrollerwidth='264px'

    var scrollerheight='100px'

    //3000 miliseconds=3 seconds

    var pausebetweenimages=3000

    //configure the below variable to change the images used in the slideshow. If you wish the images to be clickable, simply wrap the images with the appropriate <a> tag

    var slideimages=new Array()

    slideimages[0]='<img src="pictures_move_vertical_files/1075_100.jpg" border="0"></a>'

    slideimages[1]='<img src="pictures_move_vertical_files/2238_100.jpg"></a>'

    slideimages[2]='<img src="pictures_move_vertical_files/374_100.jpg"></a>'

    slideimages[3]='<img src="pictures_move_vertical_files/1897_100.jpg"></a>'

    slideimages[4]='<img src="pictures_move_vertical_files/87_100.jpg"></a>'

     

    //extend this list

    ///////Do not edit pass this line///////////////////////

    var ie=document.all

    var dom=document.getElementById

    if (slideimages.length>2)

    i=2

    else

    i=0

    function move1(whichlayer){

    tlayer=eval(whichlayer)

    if (tlayer.top>0&&tlayer.top<=5){

    tlayer.top=0

    setTimeout("move1(tlayer)",pausebetweenimages)

    setTimeout("move2(document.main.document.second)",pausebetweenimages)

    return

    }

    if (tlayer.top>=tlayer.document.height*-1){

    tlayer.top-=5

    setTimeout("move1(tlayer)",50)

    }

    else{

    tlayer.top=parseInt(scrollerheight)

    tlayer.document.write(slideimages[i])

    tlayer.document.close()

    if (i==slideimages.length-1)

    i=0

    else

    i++

    }

    }

    function move2(whichlayer){

    tlayer2=eval(whichlayer)

    if (tlayer2.top>0&&tlayer2.top<=5){

    tlayer2.top=0

    setTimeout("move2(tlayer2)",pausebetweenimages)

    setTimeout("move1(document.main.document.first)",pausebetweenimages)

    return

    }

    if (tlayer2.top>=tlayer2.document.height*-1){

    tlayer2.top-=5

    setTimeout("move2(tlayer2)",50)

    }

    else{

    tlayer2.top=parseInt(scrollerheight)

    tlayer2.document.write(slideimages[i])

    tlayer2.document.close()

    if (i==slideimages.length-1)

    i=0

    else

    i++

    }

    }

    function move3(whichdiv){

    tdiv=eval(whichdiv)

    if (parseInt(tdiv.style.top)>0&&parseInt(tdiv.style.top)<=5){

    tdiv.style.top=0+"px"

    setTimeout("move3(tdiv)",pausebetweenimages)

    setTimeout("move4(second2_obj)",pausebetweenimages)

    return

    }

    if (parseInt(tdiv.style.top)>=tdiv.offsetHeight*-1){

    tdiv.style.top=parseInt(tdiv.style.top)-5+"px"

    setTimeout("move3(tdiv)",50)

    }

    else{

    tdiv.style.top=scrollerheight

    tdiv.innerHTML=slideimages[i]

    if (i==slideimages.length-1)

    i=0

    else

    i++

    }

    }

    function move4(whichdiv){

    tdiv2=eval(whichdiv)

    if (parseInt(tdiv2.style.top)>0&&parseInt(tdiv2.style.top)<=5){

    tdiv2.style.top=0+"px"

    setTimeout("move4(tdiv2)",pausebetweenimages)

    setTimeout("move3(first2_obj)",pausebetweenimages)

    return

    }

    if (parseInt(tdiv2.style.top)>=tdiv2.offsetHeight*-1){

    tdiv2.style.top=parseInt(tdiv2.style.top)-5+"px"

    setTimeout("move4(second2_obj)",50)

    }

    else{

    tdiv2.style.top=scrollerheight

    tdiv2.innerHTML=slideimages[i]

    if (i==slideimages.length-1)

    i=0

    else

    i++

    }

    }

    function startscroll(){

    if (ie||dom){

    first2_obj=ie? first2 : document.getElementById("first2")

    second2_obj=ie? second2 : document.getElementById("second2")

    move3(first2_obj)

    second2_obj.style.top=scrollerheight

    second2_obj.style.visibility='visible'

    }

    else if (document.layers){

    document.main.visibility='show'

    move1(document.main.document.first)

    document.main.document.second.top=parseInt(scrollerheight)+5

    document.main.document.second.visibility='show'

    }

    }

    window.onload=startscroll

    </SCRIPT>

    <ILAYER id=main width="&amp;{scrollerwidth};"

    height="&amp;{scrollerheight};" visibility="hide"><LAYER id=first

    width="&amp;{scrollerwidth};" left="0" top="1">

    <SCRIPT language=JavaScript1.2>

    if (document.layers)

    document.write(slideimages[0])

    </SCRIPT>

    </LAYER><LAYER id=second width="&amp;{scrollerwidth};" visibility="hide"

    left="0" top="0">

    <SCRIPT language=JavaScript1.2>

    if (document.layers)

    document.write(slideimages[dyndetermine=(slideimages.length==1)? 0 : 1])

    </SCRIPT>

    </LAYER></ILAYER>

    <SCRIPT language=JavaScript1.2>

    if (ie||dom){

    document.writeln('<div id="main2" style="position:relative;width:'+scrollerwidth+';height:'+scrollerheight+';overflow:hidden;">')

    document.writeln('<div style="position:absolute;width:'+scrollerwidth+';height:'+scrollerheight+';clip:rect(0 '+scrollerwidth+' '+scrollerheight+' 0);left:0px;top:0px">')

    document.writeln('<div id="first2" style="position:absolute;width:'+scrollerwidth+';left:0px;top:1px;">')

    document.write(slideimages[0])

    document.writeln('</div>')

    document.writeln('<div id="second2" style="position:absolute;width:'+scrollerwidth+';left:0px;top:0px;visibility:hidden">')

    document.write(slideimages[dyndetermine=(slideimages.length==1)? 0 : 1])

    document.writeln('</div>')

    document.writeln('</div>')

    document.writeln('</div>')

    }

    </SCRIPT>

    </TD>

2.   info:
   width='264px'
  height='100px'
  pause between images=3000  miliseconds = 3 seconds
   list of pictures :
pictures_move_vertical_files/1075_100.jpg
pictures_move_vertical_files/2238_100.jpg
pictures_move_vertical_files/374_100.jpg
pictures_move_vertical_files/1897_100.jpg
pictures_move_vertical_files/87_100.jpg"

 modify these values at the javascript text
 

   
 
  Call web page example, Pictures move vertical-

  
Notes:
         Use Microsoft FrontPage software to read or write JavaScript text
, to HTML Source
 
   
 
Author.
       Chucri Simon Zouein , Beirut - Lebanon - Computer engineer
       Tel :         961-01-691436

      
Web:       http://www.puresoftwarecode.com/
       E-mail: 
   info@puresoftwarecode.com