Results 1 to 9 of 9

Thread: Moo Tools breaks conveyor belt slideshow?

  1. #1
    Join Date
    May 2008
    Posts
    144
    Thanks
    6
    Thanked 11 Times in 11 Posts

    Default Moo Tools breaks conveyor belt slideshow?

    my test page is here

    for some reason the conveyor belt slideshow doesnt "slide"
    any ideas?

    before i had all the fancy mootools effects the slideshow worked just fine.
    Last edited by thenajsays; 07-14-2009 at 04:25 PM.

  2. #2
    Join Date
    May 2008
    Posts
    144
    Thanks
    6
    Thanked 11 Times in 11 Posts

    Default

    ALSO, im puzzled as to why the scrollbar appears at the bottom now. it didnt do that before i added mootools and it doesnt appear if i remove the slideshow...

  3. #3
    Join Date
    May 2008
    Posts
    144
    Thanks
    6
    Thanked 11 Times in 11 Posts

    Default

    anyone? come on! i cant believe NO ONE has anything on this?

  4. #4
    Join Date
    May 2008
    Posts
    144
    Thanks
    6
    Thanked 11 Times in 11 Posts

    Default

    seriously??? no one has ANYTHING?

  5. #5
    Join Date
    May 2008
    Posts
    144
    Thanks
    6
    Thanked 11 Times in 11 Posts

    Default

    ok, ive narrowed it down to the sliding module (slideleft) refusing to fire after all the mootools effects have taken place... i even tried to edit the "fillup" module to remove the call to slideleft and made slideleft a delayed onLoad event and it still wont fire... the weirdest part is that if i delay "fillup" from firing until all the mootools effects have completed, it works, but i hate the look...

  6. #6
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,799
    Thanks
    2
    Thanked 420 Times in 414 Posts

    Default

    try

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    
    <head>
      <title></title>
    <style type="text/css">
    /*<![CDATA[*/
    #tst {
      position:relative;overflow:hidden;width:800px;height:135px;border:solid black 1px;
    }
    
    .slide {
      position:absolute;width:10000px;height:135px;
    
    }
    
    /*]]>*/
    </style>
    <script  type="text/javascript">
    /*<![CDATA[*/
    
    function SS(id,spd){
     var obj=document.getElementById(id);
     var slide=obj.getElementsByTagName('DIV')[0];
     var imgs=slide.getElementsByTagName('IMG');
     for (var lft=0,z0=0;z0<imgs.length;z0++){
      imgs[z0].style.position='absolute';
      imgs[z0].style.left=(lft)+'px';
      lft+=imgs[z0].width;
     }
     slide.style.width=lft+'px';
     this.max=lft;
     this.ary=[slide,slide.cloneNode(true)];
     this.ary[1].style.left=this.max+'px';
     obj.appendChild(this.ary[1]);
     this.pos=[0,this.max];
     this.spd=spd||1;
     this.to=null;
    }
    
    
    SS.prototype.Rotate=function(srt){
     clearTimeout(this.to);
     for (var z0=0;z0<this.ary.length;z0++){
      this.pos[z0]-=this.spd;
      if (this.pos[z0]<-this.max) this.pos[z0]=this.max-this.spd;
      this.ary[z0].style.left=this.pos[z0]+'px';
     }
     var oop=this;
     if (srt) this.to=setTimeout(function(){ oop.Rotate(srt); },10);
    }
    
    /*]]>*/
    </script>
    
    </head>
    
    <body >
    <div id="tst" onmouseover="if (S) S.Rotate();" onmouseout="if (S) S.Rotate(true);">
     <div class="slide">
      <img src="http://casadomani.com/images/slideshow/IMG_0907.jpg">'
      <img src="http://casadomani.com/images/slideshow/IMG_0916.jpg">
      <img src="http://casadomani.com/images/slideshow/IMG_0934.jpg">
      <img src="http://casadomani.com/images/slideshow/IMG_0928.jpg">
      <img src="http://casadomani.com/images/slideshow/IMG_0989.jpg">
      <img src="http://casadomani.com/images/slideshow/IMG_0998.jpg">
     </div>
    </div>
    
    <script type="text/javascript">
    /*<![CDATA[*/
     S=new SS('tst',.5);
     S.Rotate('true');
    /*]]>*/
    </script>
    </body>
    
    </html>
    Last edited by vwphillips; 08-20-2009 at 02:01 PM.
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

  7. #7
    Join Date
    May 2008
    Posts
    144
    Thanks
    6
    Thanked 11 Times in 11 Posts

    Default

    thanks, ill give that a try! does it load multiple random slides or is t just thoes slides in order?

  8. #8
    Join Date
    May 2008
    Posts
    144
    Thanks
    6
    Thanked 11 Times in 11 Posts

    Default

    only works if i dont implement it to the entire site... i got something workable now, check out the test again!
    i have another issue if you wouldnt mind taking a look vic... the page loads perfectly in FF and chrome... but does some funky stuff in IE... can you take a look please?

  9. #9
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,799
    Thanks
    2
    Thanked 420 Times in 414 Posts

    Default

    Code:
    .mainBody {
    	width:900px;
    	background-color:#F0FFF0;
    	overflow: hidden;
    	margin-right: auto;
    	margin-left: auto;
        display:none;
    }
    the display:none is causing the problem

    using my code

    Code:
    <script type="text/javascript">
    /*<![CDATA[*/
    var S=false;
    function Init(){
     S=new SS('tst',1);
     S.Rotate('true');
    }
     setTimeout(function(){ Init(); },5000)
    /*]]>*/
    </script>
    activates the slide show after the effects have completed, and works
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

  10. The Following User Says Thank You to vwphillips For This Useful Post:

    thenajsays (08-21-2009)

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
  •