Results 1 to 5 of 5

Thread: Cross browser Marquee script

  1. #1
    Join Date
    Oct 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Cross browser Marquee script

    1) Script Title: Cross browser Marquee script

    2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex2/cmarquee.htm

    3) Describe problem:

    The script works perfectly in FF. I have it centered at 80%, but in IE the background is the default size and the text overflows to 80%.

    Ideas?

    Thanks,
    LS


  2. #2
    Join Date
    Aug 2004
    Posts
    10,143
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Centering nested DIV tags, which are generated by this script, in IE can be tricky. Try adding the code in red to the below line:

    Code:
    document.write('<table border="0" cellspacing="0" cellpadding="0" align="center" width="300px"><td>')
    "300" should reflect the width of your marquee.

  3. #3
    Join Date
    Oct 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question

    Thank you.

    I tried it, cleared the cache and it reloaded the same way.

    Any other ideas? Scripts on the same page interfering, possibly?


  4. #4
    Join Date
    Aug 2004
    Posts
    10,143
    Thanks
    3
    Thanked 1,008 Times in 993 Posts
    Blog Entries
    16

    Default

    Ah yes I hadn't tested my code with a valid doctype added in. Now I see the problem. Try the below version instead then. Basically it takes out the "width" declarations inside the nested DIV tags, and just applies it to the <TABLE> instead. This seems to work:

    Code:
    <script language="JavaScript1.2">
    
    /*
    Cross browser Marquee script-  Dynamic Drive (www.dynamicdrive.com)
    For full source code, 100's more DHTML scripts, and Terms Of Use, visit http://www.dynamicdrive.com
    Credit MUST stay intact
    */
    
    //Specify the marquee's width (in pixels)
    var marqueewidth="70%"
    //Specify the marquee's height
    var marqueeheight="25px"
    //Specify the marquee's marquee speed (larger is faster 1-10)
    var marqueespeed=2
    //configure background color:
    var marqueebgcolor="#DEFDD9"
    //Pause marquee onMousever (0=no. 1=yes)?
    var pauseit=1
    
    //Specify the marquee's content (don't delete <nobr> tag)
    //Keep all content on ONE line, and backslash any single quotations (ie: that\'s great):
    
    var marqueecontent='<nobr><font face="Arial">Thank you for visiting <a href="http://www.dynamicdrive.com">Dynamic Drive.</a> If you find this script useful, please consider linking to us by <a href="../link.htm">click here.</a> Enjoy your stay!</font></nobr>'
    
    
    ////NO NEED TO EDIT BELOW THIS LINE////////////
    marqueespeed=(document.all)? marqueespeed : Math.max(1, marqueespeed-1) //slow speed down by 1 for NS
    var copyspeed=marqueespeed
    var pausespeed=(pauseit==0)? copyspeed: 0
    var iedom=document.all||document.getElementById
    if (iedom)
    document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+marqueecontent+'</span>')
    var actualwidth=''
    var cross_marquee, ns_marquee
    
    function populate(){
    if (iedom){
    cross_marquee=document.getElementById? document.getElementById("iemarquee") : document.all.iemarquee
    cross_marquee.style.left=parseInt(marqueewidth)+8+"px"
    cross_marquee.innerHTML=marqueecontent
    actualwidth=document.all? temp.offsetWidth : document.getElementById("temp").offsetWidth
    }
    else if (document.layers){
    ns_marquee=document.ns_marquee.document.ns_marquee2
    ns_marquee.left=parseInt(marqueewidth)+8
    ns_marquee.document.write(marqueecontent)
    ns_marquee.document.close()
    actualwidth=ns_marquee.document.width
    }
    lefttime=setInterval("scrollmarquee()",20)
    }
    window.onload=populate
    
    function scrollmarquee(){
    if (iedom){
    if (parseInt(cross_marquee.style.left)>(actualwidth*(-1)+8))
    cross_marquee.style.left=parseInt(cross_marquee.style.left)-copyspeed+"px"
    else
    cross_marquee.style.left=parseInt(marqueewidth)+8+"px"
    
    }
    else if (document.layers){
    if (ns_marquee.left>(actualwidth*(-1)+8))
    ns_marquee.left-=copyspeed
    else
    ns_marquee.left=parseInt(marqueewidth)+8
    }
    }
    
    if (iedom||document.layers){
    with (document){
    document.write('<div align="center"><table border="0" cellspacing="0" cellpadding="0" width="'+marqueewidth+'"><td>')
    if (iedom){
    write('<div style="position:relative;width:100%;height:'+marqueeheight+';overflow:hidden;">')
    write('<div style="position:absolute width:100%; ;height:'+marqueeheight+';background-color:'+marqueebgcolor+'" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">')
    write('<div id="iemarquee" style="position:absolute;left:0px;top:0px"></div>')
    write('</div></div>')
    }
    else if (document.layers){
    write('<ilayer width='+marqueewidth+' height='+marqueeheight+' name="ns_marquee" bgColor='+marqueebgcolor+'>')
    write('<layer name="ns_marquee2" left=0 top=0 onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed"></layer>')
    write('</ilayer>')
    }
    document.write('</td></table></div>')
    }
    }
    </script>

  5. #5
    Join Date
    Oct 2007
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Worked like a charm! Many thanks O Wise One!

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
  •