Results 1 to 2 of 2

Thread: Cross Browser Marquee different in FF and IE?

  1. #1
    Join Date
    Dec 2005
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Cross Browser Marquee different in FF and IE?

    Script: Cross Browser marquee
    http://www.dynamicdrive.com/dynamicindex2/cmarquee.htm

    Hi!

    when I use this, for some reason on IE6 the background of the marquee doesn't completely fill the area of the marquee the way it does on FF. You can see this on the site I'm working on (http://www.uca.edu/divisions/student...PER/hours.html)

    This is the relevant code in the page (part of a Dreamweaver 8 template):
    Code:
    <tr>
    <td height="87" colspan="2" align="center">
    <img src="../Testsite/images/bkgd_images/btn_hper.jpg" alt="HPER Menu" onClick="return clickreturnvalue()" onMouseover="dropdownimagemapmenu(this, 0, event, mnu_hper, '150px')" onMouseout="delayhidemenu()"/>
    <img src="../Testsite/images/bkgd_images/btn_fitness.jpg" alt="Fitness Menu" onClick="return clickreturnvalue()" onMouseover="dropdownimagemapmenu(this, 0, event, mnu_fitwell, '150px')" onMouseout="delayhidemenu()"/>
    <img src="../Testsite/images/bkgd_images/btn_group.jpg" alt="Group Menu" onClick="return clickreturnvalue()" onMouseover="dropdownimagemapmenu(this, 0, event, mnu_exercises, '150px')" onMouseout="delayhidemenu()"/>
    <img src="../Testsite/images/bkgd_images/btn_aquatics.jpg" alt="Aquatics Menu" onClick="return clickreturnvalue()" onMouseover="dropdownimagemapmenu(this, 0, event, mnu_aqua, '150px')" onMouseout="delayhidemenu()"/>
    <img src="../Testsite/images/bkgd_images/btn_intramurals.jpg" alt="Intramural Menu" onClick="return clickreturnvalue()" onMouseover="dropdownimagemapmenu(this, 0, event, mnu_intra, '150px')" onMouseout="delayhidemenu()"/>
    <img src="../Testsite/images/bkgd_images/btn_facilities.jpg" alt="Facilities Menu" onClick="return clickreturnvalue()" onMouseover="dropdownimagemapmenu(this, 0, event, mnu_fac, '150px')" onMouseout="delayhidemenu()"/>
    <!-- TemplateBeginEditable name="Page Heading" -->
    <h1 class="style3"></h1>
    <!-- TemplateEndEditable -->
    <!-- News & Events Scroll - This is a side-scrolling ticker for the news & events that are on the main page. -->				
    <script language="JavaScript1.2">
    /*
    Cross browser Marquee script- &#169; 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="600px"
    //Specify the marquee's height
    var marqueeheight="20px"
    //Specify the marquee's marquee speed (larger is faster 1-10)
    var marqueespeed=1
    //configure background color:
    var marqueebgcolor="#750F7D"
    //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 color="#000000">In this location is where you\'ll see the NEWS, ANNOUNCEMENT, and other IMPORTANT INFORMATION Scroll by. By moving the mouse over this area, you can pause the scrolling allowing as much time as needed for any particular bit of the text.</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('<table border="0" cellspacing="0" cellpadding="0"><td>')
    			if (iedom){
    				write('<div style="position:relative;width:'+marqueewidth+';height:'+marqueeheight+';overflow:hidden">')
    				write('<div style="position:absolute;width:'+marqueewidth+';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>')
    		}
    }
    </script>
     <!-- End Scroll -->
    </td>
    </tr>
    Any thoughts?
    Thanks!
    Thomas
    Last edited by TCArknight; 02-19-2006 at 04:59 PM.

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Just a suggestion, use either white or light colored text on that dark purple marquee background or use a lighter shade of purple for the background. As it is, it is hard to read.

    To fix the problem, find this line in the script:

    Code:
    write('<div style="position:relative;width:'+marqueewidth+';height:'+marqueeheight+';overflow:hidden">')
    Make it like so:

    Code:
    write('<div style="position:relative;width:'+marqueewidth+';height:'+marqueeheight+';overflow:hidden;background-color:'+marqueebgcolor+'">')
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

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
  •