JavaScript - Mouseover Works In Firefox But Not Ie
Works in Firefox, chrome, even my phone, but not IE
Code: <a onmouseover="document.getElementById('statusbox').innerHTML='<table width=100%><tr><th colspan=3>Carrot statuses</th></tr><tr><th>Status</th><th>Magnitude</th><th>Duration</th></tr><tr class=alt><td>DamageResistDebuff</td><td>5</td><td>2</td></tr><tr class=alt><td>DamageResistDebuff</td><td>5</td><td>2</td></tr><tr class=alt><td>Repeatattack</td><td>5</td><td>1</td></tr><tr class=alt><td>Defense</td><td>10</td><td>2</td></tr><tr class=alt><td>Regen</td><td>7</td><td>4</td></tr></table>'; document.getElementById('statusbox').style.opacity = 100; document.getElementById('statusbox').style.display = 'inline'; document.getElementById('statusbox').style.backgroundColor = 'beige'; document.getElementById('statusbox').style.zIndex = 10; document.getElementById('statusbox').style.filter = 'alpha(opacity=1.0)'" onmousedown="postXMLDoc('/ajaxget?battlerel="nofollow" target=10634','view='+10634)"> Any ideas? Similar TutorialsThe code below allows the user to hover over 1 object and it not only replaces the object but also shows an additional object between the buttons. It works great in Firefox, but does not in Internet Explorer. HELP webpage: http://www.isp.ucar.edu/ ------------ standard mouseover commands are used in index.php <CODE> <a href="http://www.tiimes.ucar.edu/beachon/" onMouseOver="imgOn('img1')" onMouseOut="imgOff('img1')"> <img src="images/buttons/button-beachon.gif" alt="BEACHON" width="181" height="74" border="0" id="img1" /></a> </CODE> ------------ <CODE> if (document.images) { img1on = new Image(); img1on.src = "images/buttons/button-beachon-on.gif"; img1off = new Image(); img1off.src = "images/buttons/button-beachon.gif"; img2on = new Image(); img2on.src = "images/buttons/button-bgs-on.gif"; img2off = new Image(); img2off.src = "images/buttons/button-bgs.gif"; img3on = new Image(); img3on.src = "images/buttons/button-iam-on.gif"; img3off = new Image(); img3off.src = "images/buttons/button-iam.gif"; img4on = new Image(); img4on.src = "images/buttons/button-nvia-on.gif"; img4off = new Image(); img4off.src = "images/buttons/button-nvia.gif"; img5on = new Image(); img5on.src = "images/buttons/button-utls-on.gif"; img5off = new Image(); img5off.src = "images/buttons/button-utls.gif"; img6on = new Image(); img6on.src = "images/buttons/button-water-on.gif"; img6off = new Image(); img6off.src = "images/buttons/button-water.gif"; img7on = new Image(); img7on.src = "images/buttons/button-exploratory-on.gif"; img7off = new Image(); img7off.src = "images/buttons/button-exploratory.gif"; // second image that does not appear in original button space img1ad = new Image(); img1ad.src = "images/buttons/beachon-overview-sm.gif"; img2ad = new Image(); img2ad.src = "images/buttons/bgs-overview-sm.gif"; img3ad = new Image(); img3ad.src = "images/buttons/iam-overview-sm.gif"; img4ad = new Image(); img4ad.src = "images/buttons/nvia-overview-sm.gif"; img5ad = new Image(); img5ad.src = "images/buttons/utls-overview-sm.gif"; img6ad = new Image(); img6ad.src = "images/buttons/water-overview-sm.gif"; img7ad = new Image(); img7ad.src = "images/buttons/exploratory-overview-sm.gif"; } { function imgOn(imgName) { if (document.images) { document[imgName].src = eval(imgName + "on.src"); document["holder"].src = eval(imgName + "ad.src"); } } } function imgOff(imgName) { if (document.images) { document[imgName].src = eval(imgName + "off.src"); document["holder"].src = "images/buttons/isp-overview-sm.gif"; } } </CODE> I'm no coder, as you will soon discover. The web work I do is from a purely novice, even hobby standpoint and the sites I create and host are nothing more than favors for friends and acquaintances who have needed but have not had a presence on the web. This being explained, I am asking those with coding skills to please take a look at the site I've just completed for a little diner down the road. (They're just starting out and can't afford to pay a professional web designer and, unfortunately, are stuck with me.) The site is http://d-n-ddiner.com I'm the first to say that the mouseover sound would drive me crazy, but the guys who own the diner are enthusiastic and want it left as is. I have had to combine scripts in order to have the "black-and-white to color" image effect work simultaneously with sound. The sound script depends on uploaded files: soundmanager.js, soundcontroller.swf and sound-config.xml and its tags are found incorporated with each involved image, within the body. The image effects are just the result of playing around with bits and pieces I've seen, mucking about the Internet. Its script is found within the head and also within the body, in each involved image's area, in mouseover, mouseout and, of course when specifying "name=" (such as Img_1). I opted for providing the sound in this manner because I am able to use an .mp3 file, rather than having to weigh through the pros and cons of .au versus .wav, etc., and the fickle nature of different browsers and plug-in crashes. After having many test the site (friends with varying operating systems and browsers) it appears that this mp3 solution makes the mouseover sound available to a broader range of users. Success has been achieved with Firefox, Safari, Netscape, Omniweb and Chrome. However, Internet Explorer and Opera seem to be the holdouts for both Mac and PC users. All this brings me to two requests: Would someone take a look at the site (particularly with Firefox) to determine if something might be done to help the page load more smoothly? Secondly, is there some sleight-of-hand that might be incorporated into the script to help IE and Opera detect the mouseover sound or do you consider these two browsers essentially not worth the bother? I am attaching a zip of the sound files I mentioned. The mp3 is not included but any mp3 snippet would do for testing, provided the sound config file is edited to reflect its file name. My primary concern is smooth page-loading; the IE and Opera issue is of less importance. Thank you for your patience and for any assistance you would offer. hi i have the following code which works fine in IE but nothing happens in firefox. Code: <html> <bgsound id="sound"> <script> function PlaySound(url) { document.all.sound.src = url; } </script> <body> <a href="#"><img src="images/butters.jpg" onMouseOver="PlaySound('http://www.pacdv.com/sounds/sounds/sound38.mp3')" /></a> </body> </html> Any one know of any good ways to make sound work in firefox? ta Since I like to minimize on graphics to keep bandwidth low, I have been using a script to simulate buttons. When you mouseover, you get some color changes which revert back when you move the mouse off. Simple, right? The problem is that firefox totally ignores the script. Even worse, safari changes on mouseover, but doesn't revert on mouseout. I have this in the heading: Code: <script LANGUAGE="JavaScript"> function ColorBlock(oRegion,sLinkID) { if (document.readyState != "complete") return; window.event.cancelBubble = true; oRegion.className = "MenuSelected"; oRegion.style.cursor="hand"; sLinkID.style.color = "black"; } function UncolorBlock(oRegion,sLinkID) { if (document.readyState != "complete") return; window.event.cancelBubble = true; var oToEl = window.event.toElement; if ((oToEl && !oRegion.contains(oToEl))||!oToEl) { sLinkID.style.color = "white"; oRegion.className = "MenuUnSelected"; } } </script> And this is in the body. Code: <table class=MenuTable> <tr><td OnMouseover="ColorBlock(this, Link4);" OnMouseout="UncolorBlock(this, Link4);" CLASS="MenuUnSelected" nowrap> <a STYLE="color:white" ID="Link4" OnMouseover="this.style.textDecorationNone=true;" href="javascript:createWindow('edu.htm','edu','toolbar=1,location=1,directories=1,status=1,menubar=1,scrollbars=1,resizable=1,width=825,height=725')"> <div style="width:144; cursor=hand; font-weight:bold;"> Education </a></div></td> </tr> </table> I have a bunch of these "buttons" ... firefox ignoring the code is annoying but safari only using half the code makes it look really bad. Anyone have any ideas? I've done a lot of work over time on the site, there are just a few bugs that have been avoiding me and I am trying to hunt them all down and kill them. The page is at www.adam-k-watts.com Hi All I have a content slider, but it only seems to work in FF and not any of the other browsers. I am using Wordpress but its not a plugin This is what I have: page.php Code: <?php if (is_front_page()) { include ("homepage-slider.php"); } ?> homepage-slider.php Code: <!-- Inner content DIVs should always carry "contentdiv" CSS class --> <!-- Pagination DIV should always carry "paginate-SLIDERID" CSS class --> <div id="slider1" class="sliderwrapper"> <div class="contentdiv"> <div class="home-div1"> <div class="home-div-logo"></div> </div> </div> <div class="contentdiv"> <div class="home-div2"> <span></span> </div> </div> <div class="contentdiv"> <div class="home-div3"> <span></span> </div> </div> </div> <div id="paginate-slider1" class="pagination" style="display:none;"> </div> <script type="text/javascript"> featuredcontentslider.init({ id: "slider1", //id of main slider DIV contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"] toc: "#increment", //Valid values: "#increment", "markup", ["label1", "label2", etc] nextprev: ["Previous", "Next"], //labels for "prev" and "next" links. Set to "" to hide. revealtype: "click", //Behavior of pagination links to reveal the slides: "click" or "mouseover" enablefade: [true, 0.2], //[true/false, fadedegree] autorotate: [true, 4000], //[true/false, pausetime] onChange: function(previndex, curindex){ //event handler fired whenever script changes slide //previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc) //curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc) } }) </script> There are 2 other external files : contentslider.js contentslider.css Click Here to see site. If someone could help I would really appreciate it, been bugging me big time. Cheers, Jay been a while since i been to the experts for help figures i was about due for an issue beyond my solving capabilities ok so the code The function containing the rogue setTimeout Code: function refresh_timer(){ //alert(window.timer); var total = getTotal(); document.getElementById('status').innerHTML = 'Updating in '+ (total-(window.timer+1))+' seconds.'; if((total-window.timer) == 0){ refresh_feed(); } else{ //setTimeout("refresh_timer()",1000); setTimeout(function(){ alert("");},1000); window.timer++; //alert("1"); //alert(window.timer); } } everything in the above function works except the setTimeout itself the script doesn't break and i get no errors in the firebug initially window.timer is set to 0 and everytime refresh_feed() executes window.timer gets reset to 0 refresh_timer() gets called up by the return from an ajax call(again works in chrome and ie8) any help is appreciated I'm new to HTML and javascript programming, so I apologize if the solution to this is blatantly obvious. I've got expanding text / menus in javascript on my page. These all work in IE with no problems that I can tell. Unfortunately, when I view the page in Firefox, only the first expanding menu is actually a link and works - the rest do not even appear as links and don't work (and the expanded text isn't showing either). You can visit the page at http://www.scienceadvice.ca/uploads/...s/may2010.html Any help would be most appreciated! Thanks! Hi, I've been trying to solve this problem for the past few hours and I'm at my wit's end. I have a script that runs through all the div elements on the page, and then if the div's background is a certain color, it increments a counter by 0.5 and then outputs the result into a separate div tag. This works flawlessly in IE, however I cannot get it to work in Firefox. The strange thing is, if I omit the loop and just use the colorToHex on one specific element in the divs array (ie. divs[2]) it works in Firefox. Any suggestions are greatly appreciated. Code: function hrsavailable() { var divs = document.getElementsByTagName("div"); var srdjanhrs = -0.5; for (var i=0;i<divs.length;i++){ if (colorToHex(divs[i].style.backgroundColor) == "#ffbb6e") {; srdjanhrs = srdjanhrs + 0.5; } } document.getElementById("srdjanhrs").firstChild.data = srdjanhrs; } function colorToHex(color) { if (color.substr(0, 1) === '#') { return color; } var digits = /(.*?)rgb\((\d+), (\d+), (\d+)\)/.exec(color); var red = parseInt(digits[2]); var green = parseInt(digits[3]); var blue = parseInt(digits[4]); var rgb = blue | (green << 8) | (red << 16); return digits[1] + '#' + rgb.toString(16); } Hello. When a user visits index.html on my site, they input their email address. The form redirects them to "confirmed.html", the form also writes a cookie with their email address. When the user gets to confirmed.html, I use an "if/else" statement. If there is a cookie (email address), I append ("#"+user_email) to the window location. I do this so that when the user shares with "addthis" tool, I will know who is sharing. Unfortunately addthis only shares the current page, so I want new users to the site to be redirected to index.html My code works in firefox, but not safari. In safari it just seems to redirect to index nomatter what. The user never even sees confirmed.html. Code: var user_email = unescape(document.cookie); if (document.cookie) { window.location.replace("#"+user_email); } else { window.location.replace("index.html"); } })(); </script> The website is www.saverally.com Hey, I'm trying to write a script that makes it so that when using a screen width of 1280 or lower, Google shows one ad at the top of the page. With screen widths over 1280, it shows 2 ads along the side of the screen. I've checked it several times and I don't know what I've done wrong (but I'm also a beginner). The script works flawlessly in all versions of Firefox for both high and low res (I checked with FF 2.0, 3.0, 3.5, and 3.6) but in IE6 and IE8 while displaying almost correctly at the high resolution, it gets completely screwed up at the low resolution. Basically I'm just using Javascript to insert HTML comment tags around the ads that I don't want to appear for that resolution. Apparently it doesn't work in Opera, Chrome, or Safari either and the code doesn't validate as XHTML so there is definitely something wrong. Code: <!-- Test run of Google AdSense --> <!-- One ad floats left, one floats right, the rest of the body is center aligned in between (high res only) --> <!-- There are 3 ads, scripting makes it so that 2 appear on the sides with a screen width above 1280 pixels, and below 1280 pixels just one appears across the top --> <script type="text/javascript"> <!-- var skip1 = "<!--"; if ( screen.width <= 1280 ) { document.write (skip1); } //--> </script> <div style=" float:left; font-size:7pt; color:#777; "> Advertisement<br /> <script type="text/javascript"><!-- google_ad_client = "pub-9736870014804453"; /* 160x600, created 2/2/11, left side homepage */ google_ad_slot = "6021069285"; google_ad_width = 160; google_ad_height = 600; //--> </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> </div> <div style=" float:right; font-size:7pt; color:#777; "> Advertisement<br /> <script type="text/javascript"><!-- google_ad_client = "pub-9736870014804453"; /* 160x600, created 2/2/11, homepage */ google_ad_slot = "3502793671"; google_ad_width = 160; google_ad_height = 600; //--> </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> </div> <script type="text/javascript"> <!-- var skip2 = "-->"; if ( screen.width <= 1280 ) { document.write (skip2); } //--> </script> <script type="text/javascript"> <!-- var skip3 = "<!--"; if ( screen.width > 1280 ) { document.write (skip3); } //--> </script> <div style="font-size:7pt; color:#777;"> <center> Advertisement<br /><br /> <script type="text/javascript"><!-- google_ad_client = "pub-9736870014804453"; /* low res top ad */ google_ad_slot = "4610054252"; google_ad_width = 728; google_ad_height = 90; //--> </script> <script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"> </script> </center> </div> <script type="text/javascript"> <!-- var skip4 = "-->"; if ( screen.width > 1280 ) { document.write (skip4); } //--> </script> <!-- End of Adsense side banners --> I have a portfolio page on our company site that functions properly on Mac, but not in Windows. The page is here, but I warn you it will possibly freeze IE if you click it. I include it for reference. http://www.dgindy.com/html/portfolio.html In IE, the first thumbnail (of 32) will display and then the page generally locks. I believe the javascript that governs the popups may be the culprit, but I only know enough to be dangerous and need an assist as this site is already live and that was my screwup. The script link is: <script type="text/javascript" src="popup.js"></script> And the script is: function popup(url) { newwindow=window.open(url,'name','height=575,width=620,top=200,left=200'); if (window.focus) {newwindow.focus()} return false; } And finally, here is one of the popup links: <a href="01.html" class="p01" onclick="return popup('01.html')"><span class="displace">Portfolio 01</a> Any assistance is greatly appreciated. If you need to see my css, let mw know. Hi, I'm making a Google Map that reads info from a database and pulls Twitter usernames from it to plot points on a map. In the infowindow of these points I have some code that displays the Twitter users latest tweet. There's alot of code for this map so i'll only show you the part i'm working on: Code: function readData() { var request = GXmlHttp.create(); request.open("GET", "phpsqlinfo_result.php", true); request.onreadystatechange = function() { if (request.readyState == 4) { var xmlDoc = GXml.parse(request.responseText); // obtain the array of markers and loop through it i=[0]; markers=[0]; map.getInfoWindow().hide(); gmarkers = []; map.clearOverlays(); side_bar_html = ""; var markers = xmlDoc.documentElement.getElementsByTagName("marker"); for (var i = 0; i < markers.length; i++) { // obtain the attribues of each marker var lat = parseFloat(markers[i].getAttribute("lat")); var lng = parseFloat(markers[i].getAttribute("lng")); var point = new GLatLng(lat,lng); var label = markers[i].getAttribute("name"); var address = markers[i].getAttribute("address"); var type = markers[i].getAttribute("type"); var html = '<' + 'script src="http://twitter.com/javascripts/blogger.js"><' + '/script><' + 'script type="text/javascript" src="http://twitter.com/statuses/user_timeline/' + label + '.json?callback=twitterCallback2&count=1"><' + '/script><br /><div id="twitter_update_list" style="list-style:none"></div>'; // create the marker var marker = createMarker(point,label,html); map.addOverlay(marker); } // put the assembled side_bar_html contents into the side_bar div document.getElementById("side_bar").innerHTML = side_bar_html; } } request.send(null); } var html is where it's all happening. I'm using the Twitter script from http://limetouch.com/article/valid-x...vascript-code/ and I have it laid out with all them ' + ' to break it up so it doesn't end the actual javascript used to create the map. I'm new to Javascript so I don't know too much. I know that this method is a really backwards way of doing it, but it works for Firefox. I'm able to retrieve the users latest tweet when I click on their map marker. What I want to know is why it doesn't work in any other browser? I've tried IE7+8, Google Chrome, Opera, and Safari and no tweet displays. Sub-question: While a tweet does display in Firefox, the infowindow doesn't resize with the dynamic content. Any way to fix that? This works fine in IE only. Any thoughts. function DisplaySelectedColor(cColor) { var elToFill = document.getElementById(cFieldOnFocus) elToFill.value = cColor; switch(cFieldOnFocus){ case"Page-Background":document.getElementById("Page").style.backgroundColor =cColor; break; case"Page-Background": document.getElementById("Page").style.backgroundColor =cColor; break; case"Outside-Border": document.getElementById("main_container").style.borderColor =cColor; break; case"Logo-Background": document.getElementById("logo_area").style.backgroundColor =cColor; break; case"Logo-Font": document.getElementById("logo_area").style.color =cColor; break; case"Outside-Area-Background": document.getElementById("main_container").style.backgroundColor =cColor; document.getElementById("linktestdiv").style.backgroundColor =cColor; break; case"Outside-Area-Font": document.getElementById("main_container").style.color =cColor; document.getElementById("main_nav").style.color =cColor; document.getElementById("right_column_content").style.color =cColor; document.getElementById("linktestdiv").style.color =cColor; document.getElementById("footer").style.color =cColor; break; case"Content-Background": document.getElementById("main_content").style.backgroundColor =cColor; break; case"Content-Font": document.getElementById("main_content").style.color =cColor; break; case"Footer-Background": document.getElementById("footer").style.backgroundColor =cColor; break; case"Hyper-Link": document.getElementById("activelink").style.color = cColor; break; case"Hyper-Link-Hover": document.getElementById("hoverlink").style.color = cColor; break; case"Hyper-Link-Visited": document.getElementById("visitedlink").style.color = cColor; break; } } Thanks for any help. Can't figure it out. Hi, I am using googles O3D software and it uses a javascript base, one of there plugins works in Firefox only and not Internet Explorer I was wondering if anyone here could help me find out why it isnt working in IE and even how to fix it, here is the page that works in firefox but not IE http://o3d.googlecode.com/svn/trunk/...edesigner.html Many Thanks, Simon Hi I am not really sure where to start with this as my function works perfect in IE 6. However when I select one of my categories and hit submit in Firefox or IE7 or 8 nothing happens. No error message. Just nothing. How can I get this working for firefox and IE7/8? Code: <script language="JavaScript"> var categories=[]; var categorieslist=[]; var thecategories=[]; var ItemDetails=[]; var selDate=[]; var content=[]; var imagePaths=[]; var art=[]; var aTheDates=[]; var aTheYear=[]; var catDM=" "; var catUrl=""; var startposition=0; var theImage=""; var pageDectect=0; var thepage=0; var pc=0; var starty=0; var pagenumber=0; var filteredlist="<ul class='press-items'>"; function changeFilter(){ var selCategory=document.getElementById("browsetopic").value; //alert(selCategory + " aha"); var selYear=document.getElementById("browseyear").value.substring(2,4); var selMonth=document.getElementById("browsemonth").value; //var selDate=document.getElementById("browsemonth").value + "/" + document.getElementById("browseyear").value.substring(2,4); //alert(pagenumber); for(pagenumber;pagenumber<art.length;pagenumber++){ //alert(selDate + "=" + aTheDates[pagenumber]); //alert(selYear + "=" + aTheYear[pagenumber]); //alert(selCategory + "=" + categories[pagenumber]); if(((selCategory=="nofilter"||categories[pagenumber]==selCategory))&&(selYear==aTheYear[pagenumber]||selYear=="00")&&(selMonth==aTheDates[pagenumber]||selMonth=="00")){ filteredlist=filteredlist+art[pagenumber]; } } filteredlist=filteredlist+"</ul>"; //alert(filteredlist); document.getElementById("theid").innerHTML=filteredlist; filteredlist="<ul class='press-items'>"; pagenumber=0; } </script> And the button Code: <a href="javascript:changeFilter();"><img style=" float: left; margin-top: 0px;" class="submit" src="/images/submit.gif" /></a> Hi, JS newbie here trying to cobble together enough to get this page done. Here's the snippet I'm having trouble with (sorry, I know it's sloppy, if you have a better way to do it by all means please post): Code: function showAdv() { if(claroxanadvanced.style.display == "none") { claroxanadvanced.style.display = "block"; claroxanoriginal.style.display = "none"; smokersformula.style.display = "none"; } else { } } function showOri() { if(claroxanoriginal.style.display == "none") { claroxanadvanced.style.display = "none"; claroxanoriginal.style.display = "block"; smokersformula.style.display = "none"; } else { } } function showSmo() { if(smokersformula.style.display == "none") { claroxanadvanced.style.display = "none"; claroxanoriginal.style.display = "none"; smokersformula.style.display = "block"; } else { } } And the page where it is implemented: http://www.claroxan.com/test/ Firefox's debug window says it might be an issue of undeclared variables - 'claroxanadvanced', 'claroxanoriginal' and 'smokersformula' are all div IDs in the html, what line should I put to declare them? Thanks Code: function toggle(div_id) { var el = document.getElementById(div_id); if ( el.style.display == 'none' ) { el.style.display = 'block';} else {el.style.display = 'none';} } function blanket_size(popUpDivVar) { if (typeof window.innerWidth != 'undefined') { viewportheight = window.innerHeight; } else { viewportheight = document.documentElement.clientHeight; } if ((viewportheight > document.body.parentNode.scrollHeight) && (viewportheight > document.body.parentNode.clientHeight)) { blanket_height = viewportheight; } else { if (document.body.parentNode.clientHeight > document.body.parentNode.scrollHeight) { blanket_height = document.body.parentNode.clientHeight; } else { blanket_height = document.body.parentNode.scrollHeight; } } var blanket = document.getElementById('blanket'); blanket.style.height = blanket_height + 'px'; var popUpDiv = document.getElementById(popUpDivVar); popUpDiv_height=200 popUpDiv.style.top = popUpDiv_height + 'px'; } function window_pos(popUpDivVar) { if (typeof window.innerWidth != 'undefined') { viewportwidth = window.innerHeight; } else { viewportwidth = document.documentElement.clientHeight; } if ((viewportwidth > document.body.parentNode.scrollWidth) && (viewportwidth > document.body.parentNode.clientWidth)) { window_width = viewportwidth; } else { if (document.body.parentNode.clientWidth > document.body.parentNode.scrollWidth) { window_width = document.body.parentNode.clientWidth; } else { window_width = document.body.parentNode.scrollWidth; } } var popUpDiv = document.getElementById(popUpDivVar); window_width=window_width/2-150;//150 is half popup's width popUpDiv.style.left = window_width + 'px'; } function popup(windowname) { blanket_size(windowname); window_pos(windowname); toggle('blanket'); toggle(windowname); } I have know much about javascript, but the code above works fine in safari and firefox but not IE. it's for a popup, when you click a link it blankets the page and theres a popup window. here's other parts of supporting css/php Code: <?php if(!$_POST['submit'] == 'login'){ echo "<div id=\"blanket\" style=\"display:none;\"></div>\n"; echo "<div id=\"popUpDiv\" style=\"display:none;\">\n"; echo "<div id=\"loginform\">\n"; echo '<div id="close">'; echo "<a href=\"#\" onclick=\"popup('popUpDiv')\">\n"; echo '<img src="images/login/close.png" border="0">'; echo "</a>\n"; echo '</div>'; echo '<div class="clear"></div>'; echo "<form name=\"login\" method=\"post\" action=\"#\">\n"; echo "<div id=\"usernametext\">Username</div>\n"; echo "<input name=\"username\" type=\"text\" id=\"usernameinput\">\n"; echo '<div class="clear"></div>'; echo "<div id=\"passwordtext\">Password</div>\n"; echo "<input name=\"password\" type=\"password\" id=\"passwordinput\">\n"; echo '<div class="clear"></div>'; echo '<div id="loginsubmit"><input type="submit" name="submit" value="Submit"></div>'; echo "</form>\n"; echo "</div>\n"; echo "</div>\n"; echo "<span class=\"login_text\"><a href=\"#\" onclick=\"popup('popUpDiv')\">LOG IN</a></span>\n"; ?> Code: #blanket { background-color:#000000; opacity: 0.40; filter:alpha(opacity=40); position:absolute; z-index: 10; padding:0; top:0; right:0; left:0; bottom:0; width:100%; height:100%; margin:0 0 0 0; } #popUpDiv { position:absolute; background-color:#FFFFFF; width:280px; height:135px; z-index: 10; } any help would be VERY much appreciated. thanks I have a script where the user selects an item on the main nav and it will display the sub-nav below. It works fine in every browser except Firefox. ANy ideas? http://tinyurl.com/79wlwq3 EDIT: It's just that script that won't work, btw. I tested an alert box for Firefox and it works fine. Can anyone tell me why the following works in IE but not the other browsers? It's the "Select category..." jump menu at this URL: www.savasbeatie.com/books.htm Code: <TD> <form name="whichCat" style="margin-bottom:0" method="get"> <select name="catChoice" onChange="sendValue(this);"> <option class="news4" value="javascript:location.reload(true)" selected>Select Category...</option> <option class="news4" value="php/IraqWars.php?q=Iraq%20Wars">Iraq Wars/Current Affairs</option> <option class="news4" value="php/AncientHistory.php?q=Ancient%20History">Ancient History</option> <option class="news4" value="php/AmericanRevolution.php?q=American%20Revolution">American Revolution</option> <option class="news4" value="php/NapoleonicWar.php?q=Napoleonic%20War">Napoleonic War</option> <option class="news4" value="php/AmericanCivilWar.php?q=American%20Civil%20War">American Civil War</option> <option class="news4" value="php/IndianWars.php?q=Indian%20Wars">Indian Wars</option> <option class="news4" value="php/WorldWars.php?q=World%20Wars">World Wars</option> <option class="news4" value="php/Naval.php?q=Naval">Naval</option> <option class="news4" value="php/MilitaryScience.php?q=Military%20Science">Military Science</option> <option class="news4" value="php/SportsHistory.php?q=Sports%20History">Sports History</option> <option class="news4" value="php/Other.php?q=Other">Other</option> </select> </form> </TD> I've been called in to help with this, but did not build the site. There's a frame that's supposed to display the link contents, and it's returning the error: Error: document.getElementById("SB_Frame") is null Source File: http://savasbeatie.com/jscripts/SB_util.js Line: 11 I think it has something to do with the ID of the frame, (from Googling the error and reading some other posts,) but can't figure out where to put the tag. Thanks for any help. - David // otherwise search the parent element tempElem=tempElem.parentElement; // return when it reaches the top of the code if(tempElem.tagName=="HTML") { return el; } } return tempElem; } function fixTBpos() { var OCode = document.getElementById('OCode'); var ODiv = document.getElementById('ODiv'); st=document.body; if(isW3Mode) OCode.style.height=ODiv.style.height=st.clientHeight-119; else OCode.style.height=ODiv.style.height=st.clientHeight-113; typeof(toc) == "undefined" ? '':Resizetoc(); } function hasTagsInText(text) { if(text.indexOf("<TABLE") >=0 || text.indexOf("<table") >=0) return 'table';<<<<<<<<NOT WORKING if(text.indexOf("<TD") >=0 || text.indexOf("<td") >=0) return 'column'; if(text.indexOf("<IMG") >=0 || text.indexOf("<img") >=0) return 'image'; if(text.indexOf("<H2") >=0 || text.indexOf("<h2") >=0) return 'h2'; if(text.indexOf("<DIV") >=0 || text.indexOf("<div") >=0) return 'div'; if(text.indexOf("<A") >=0 || text.indexOf("<a") >=0) return 'link'; if(text.indexOf("<FORM") >=0 || text.indexOf("<form") >=0) return 'form'; if(text.indexOf("<P>") >=0 || text.indexOf("<p>") >=0) return 'invisible paragraph-mark'; if(text.indexOf("<BR>") >=0 || text.indexOf("<br>") >=0) return 'invisible new-line-mark'; return ''; } function hasFormatInText(text) { var format = '' if(text.indexOf("id=subtitle") >=0) format+= 'id=subtitle' if(text.indexOf("class=greytext") >=0) format+= 'class=greytext' if(text.indexOf("class=prices") >=0) format+= 'class=prices' if(text.indexOf("class=small") >=0) format+= 'class=small' if(text.indexOf("class=bct") >=0) format+= 'class=bct' // jae added if(text.indexOf("class=price") >=0) format+= 'class=price' if(text.indexOf("class=error") >=0) format+= 'class=error' // to here if(text.indexOf("<BLOCKQUOTE ") >=0 || text.indexOf("<BLOCKQUOTE>") >=0) format+= 'header=blockquote' if(text.indexOf("formatted-text") >=0 || text.indexOf("class=")>=0) format+= 'id=misctext' if(text.indexOf("<SPAN ") >=0 || text.indexOf("<SPAN>") >=0) format+= 'span' if(text.indexOf("<H1 ") >=0 || text.indexOf("<H1>") >=0) format+= 'header=h1' if(text.indexOf("<H2 ") >=0 || text.indexOf("<H2>") >=0) format+= 'header=h2' if(text.indexOf("<H3 ") >=0 || text.indexOf("<H3>") >=0) format+= 'header=h1' if(text.indexOf("<H4 ") >=0 || text.indexOf("<H4>") >=0) format+= 'header=h2' if(text.indexOf("<EM ") >=0 || text.indexOf("<EM>") >=0) format+= 'style=em' if(text.indexOf("<B ") >=0 || text.indexOf("<B>") >=0) format+= 'style=b' if(text.indexOf("<STRONG ") >=0 || text.indexOf("<STRONG>") >=0) format+= 'style=strong' if(text.indexOf("<I ") >=0 || text.indexOf("<I>") >=0) format+= 'style=i' if(text.indexOf("<U ") >=0 || text.indexOf("<U>") >=0) format+= 'style=u' if(text.indexOf("<FONT ") >=0 || text.indexOf("<FONT>") >=0) format+= 'style=font' return format } |