Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Jan 2009
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Issues with slideshow and Internet Explorer OK with Firefox

    I am having some problems with a webpage I was required to make for a class. Everything works fine in firefox but the teacher will be looking at it in internet explorer. I am utilizing Internet explorer v.7 but when it comes to doing the slideshow it will transition from image to image fine in firefox but when you click the left arrow in internet explorer it won't change pictures. Here is all my coding.
    Code:
    <html>
    <head>
    <!-- 
       New Perspectives on JavaScript
       Tutorial 1
       Review Assignment
    
       Monroe Public Library
       Author: Kristan Washburn	
       Date:   Jan 15, 2008
    
       Filename:         mpl2.htm
       Supporting files: mpl2.jpg, mplstyles.css, random.js, 0.jpg - 9.jpg
    -->
    
    <title>Kristan's Webpage</title>
    <script type= "text/javascript" src= "calendarclock.js"> </script>
    <link href="indexstyles.css" rel="stylesheet" type="text/css" />
    <script>
     var tick;
     function stop() {
       clearTimeout(tick);
       }
     function simpleClock() {
       var ut=new Date();
       var h,m,s;
       var time="        ";
       h=ut.getHours();
       m=ut.getMinutes();
       s=ut.getSeconds();
       if(s<=9) s="0"+s;
       if(m<=9) m="0"+m;
       if(h<=9) h="0"+h;
       time+=h+":"+m+":"+s;
       document.sclock.stime.value=time;
       tick=setTimeout("simpleClock()",1000);    
       }
    </script>
    </head>
    
    
    
    <body>
    
    
    
    <BODY  onLoad="simpleClock();" onUnload="stop();"> 
    
    <FORM NAME="sclock">
    <p> Time:<INPUT TYPE="text" NAME="stime" SIZE="13"></p>
    </FORM>
    </head>
    
    
    <h2>Animal Tracks</h2>
    <p id="description">Below you will see a variety of animal tracks found in the snow. These tracks include those of a red fox, snowshoe hare, chickadee, mouse, ruffed grouse, and canadian lynx. See if you can identify which is which.</p>
    
    <p><img name="Photo" id="Photo" src="slide00.jpg" alt="" /></p>
    <p>
       <a href="Javascript:SlideShow('reverse')" onmouseup= LOut() onmousedown= LIn() >
          <img name="LeftArrow" id="LeftArrow" src="lup.gif" alt="" />
       </a>
       <a href="Javascript:SlideShow('forward')"  onmouseup= ROut() onmousedown= RIn()>
          <img name="RightArrow" id="RightArrow" src="rup.gif" alt="" />
       </a>
       <br />
       Click the arrows to scroll through a slide show of the different animal tracks.
    </p>
    
    
    
    
    </body>
    </html>
    Code:
    /* JS for clockpage.htm*/
    
    var todaydate=new Date()
    var curmonth=todaydate.getMonth()+1 //get current month (1-12)
    var curyear=todaydate.getFullYear() //get current year
    
    document.write(buildCal(curmonth ,curyear, "main", "month", "daysofweek", "days", 1));
    
    /*JS for calendar*/
    
    function buildCal(m, y, cM, cH, cDW, cD, brdr){
    var mn=['January','February','March','April','May','June','July','August','September','October','November','December'];
    var dim=[31,0,31,30,31,30,31,31,30,31,30,31];
    
    var oD = new Date(y, m-1, 1); //DD replaced line to fix date bug when current day is 31st
    oD.od=oD.getDay()+1; //DD replaced line to fix date bug when current day is 31st
    
    var todaydate=new Date() //DD added
    var scanfortoday=(y==todaydate.getFullYear() && m==todaydate.getMonth()+1)? todaydate.getDate() : 0 //DD added
    
    dim[1]=(((oD.getFullYear()%100!=0)&&(oD.getFullYear()%4==0))||(oD.getFullYear()%400==0))?29:28;
    var t='<div class="'+cM+'"><table class="'+cM+'" cols="7" cellpadding="0" border="'+brdr+'" cellspacing="0"><tr align="center">';
    t+='<td colspan="7" align="center" class="'+cH+'">'+mn[m-1]+' - '+y+'</td></tr><tr align="center">';
    for(s=0;s<7;s++)t+='<td class="'+cDW+'">'+"SMTWTFS".substr(s,1)+'</td>';
    t+='</tr><tr align="center">';
    for(i=1;i<=42;i++){
    var x=((i-oD.od>=0)&&(i-oD.od<dim[m-1]))? i-oD.od+1 : '&nbsp;';
    if (x==scanfortoday) //DD added
    x='<span id="today">'+x+'</span>' //DD added
    t+='<td class="'+cD+'">'+x+'</td>';
    if(((i)%7==0)&&(i<36))t+='</tr><tr align="center">';
    }
    return t+='</tr></table></div>';
    }
    
    
    /*JS for slide show*/
    
    var RUp = new Image();
    RUp.src= "rup.gif";
    var RDown = new Image();
    RDown.src = "rdown.gif";
    var LUp = new Image();
    LUp.src = "lup.gif";
    var LDown = new Image();
    LDown.src = "ldown.gif";
    
    var Slides=new Array();
    Slides[0]=new Image();
    Slides[1]=new Image();
    Slides[2]=new Image();
    Slides[3]=new Image();
    Slides[4]=new Image();
    Slides[5]=new Image();
    Slides[6]=new Image();
    Slides[7]=new Image();
    Slides[8]=new Image();
    Slides[9]=new Image();
    Slides[10]=new Image();
    Slides[11]=new Image();
    Slides[0].src="slide00.jpg";
    Slides[1].src="slide01.jpg";
    Slides[2].src="slide02.jpg";
    Slides[3].src="slide03.jpg";
    Slides[4].src="slide04.jpg";
    Slides[5].src="slide05.jpg";
    Slides[6].src="slide06.jpg";
    Slides[7].src="slide07.jpg";
    Slides[8].src="slide08.jpg";
    Slides[9].src="slide09.jpg";
    Slides[10].src="slide10.jpg";
    Slides[11].src="slide11.jpg";
    
    function LIn () {
    document.images["LeftArrow"].src=LDown.src;
    }
    
    function LOut() {
    document.images["LeftArrow"].src=LUp.src;
    }
    
    function RIn() {
    document.images["RightArrow"].src=RDown.src;
    }
    
    function ROut() {
    document.images("RightArrow").src=RUp.src;
    }
    
    var SlideNum = 0;
    
    function TransSlide(direction){
    document.images["Photo"].filters[0].motion=direction;
    document.images["Photo"].filters[0].apply();
    document.images["Photo"].src = Slides[SlideNum].src;
    document.images["Photo"].filters[0].play(2);
    }
    
    function SlideShow(direction) {
    if (direction == "forward") {
    SlideNum = (SlideNum == 11) ? 0 : SlideNum+1;
    } else {
    SlideNum = (SlideNum == 0) ? 11: SlideNum-1;
    }
    if (document.images["Photo"].filters) {
    TransSlide(direction);
    }else{
    document.images["Photo"].src=Slides[SlideNum].src;
    }
    }
    Thanks for any help in advance.

  • #2
    Regular Coder
    Join Date
    Mar 2009
    Location
    Portland Oregon
    Posts
    690
    Thanks
    44
    Thanked 63 Times in 62 Posts
    you didn't include a reference to reverse. instead of else try

    if (direction == "reverse") {
    SlideNum = (SlideNum == 0) ? 11: SlideNum-1;
    }

  • #3
    Regular Coder
    Join Date
    Mar 2009
    Location
    Portland Oregon
    Posts
    690
    Thanks
    44
    Thanked 63 Times in 62 Posts
    where's the CSS? I can't tell if it works

  • #4
    Regular Coder
    Join Date
    Mar 2009
    Location
    Portland Oregon
    Posts
    690
    Thanks
    44
    Thanked 63 Times in 62 Posts
    OK it works


  •  

    Posting Permissions

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