JavaScript - Internet Explorer Issues Rollover Issue
Hey guys,
I am having a bit of a hassle getting IE8 and 9 to deal with a rollover properly. On this page: http://www.robleydesign.com/works/ If you rollover any of the projects a View Project button comes up. In Firefox, Safari, Chrome ect.. the area for the hit box on that link is large and easy to click. For some reason in Internet Explorer it becomes a huge frustration clicking the button. I can't figure out why its not treating the whole button as a block element. Similar TutorialsHello, I have been trying to trouble shoot this for quite a while and am stuck. My site works 100% on Firefox, Safari, and Chrome, but in Internet Explore (6,7,8) the only thing that shows up is the background image. The site utilizes a few scripts: MooTools, a rollover replacement script, an iframe custom scrollbar script, and the Zenphoto CMS, that is utilized on other pages and displayed in the iframes. I think my problem may be mootools related, bur really have no idea. This is the site: http://www.ErikaCervantes.com Here is the offending code: 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"> <head> <title>ErikaCervantes.com</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <style type="text/css"> #main{width:1100px;height:618px;background: url('img/BG.jpg') no-repeat;margin-left:-550px;left:50%;position:absolute} #words{text-align:right;padding-right:30px;padding-top:30px;} .window{width:963px;height:492px;margin-left:-477px;left:50%;position:absolute;background: url('img/windowBG.jpg');top:49px;} .content{float:left;width:618px;height:330px;margin-left:55px;} .scroll{height:220px;width:36px;float:right;text-align:left;margin-top:60px;} .contenthead{padding-top:52px;padding-left:47px;height:35px;width:300px;margin-bottom:15px;} .right{padding-right: 50px; padding-top: 57px; text-align:right;width:200px;float:right;} .back{padding-top:145px;margin-right:-10px} .nav .left{width:600px;height:490px;float:left;} #production{visibility: hidden;} #erika{visibility:hidden;} img{border:0px;} </style> <script type="text/javascript" src="roll.js"></script> <script type="text/javascript" src="mootools.js"></script> <script type="text/javascript"> function showErika(){ $('words').tween('opacity',0); $('erika').set('tween',{duration : 2000}).fade([0,1]); } function hideErika(){ $('erika').tween('opacity',0); $('words').set('tween',{duration : 2000}).fade([0,1]); } function showProduction(){ $('words').tween('opacity',0); $('production').set('tween',{duration : 2000}).fade([0,1]); } function hideProduction(){ $('production').tween('opacity',0); $('words').set('tween',{duration : 2000}).fade([0,1]); } </script> </head> <body style="padding-top:15px;"> <div id="main"> <div id="words"><img src="img/erika_off.jpg" alt="erika_off" width="" height="" onclick="javascript:showErika();" /><img src="img/productions_off.jpg" alt="productions_off" width="" height="" onclick="javascript:showProduction();" style="padding-top:10px;" /></div><!--words--> <div class="window" id="erika"> <div class="right"> <div id="navErika"> <a href="http://www.imdb.com/name/nm2563825/" target="_blank"><img src="img/imdb_off.jpg" width="" alt="Erika Cervantes on IMDB" height="" /></a> <a href="ECfilmography.pdf" ><img src="img/filmog_off.jpg" alt="Download Erika Cervantes Filmography" width="" height="" /></a> <a href="#" target="_blank"><img src="img/editing_off.jpg" alt="View Erika Cervantes Editing Reel" width="" height="" /></a> <a href="mailto:erikamcervantes@gmail.com" ><img src="img/contact_off.jpg" alt="Contact Erika Cervantes" width="" height="" /></a> </div><!--navErika--> <img src="img/erikamail.jpg" alt="erikamail" width="" height="" /> <div class="back"><img src="img/back_off.jpg" alt="Back" width="" height="" onclick="javascript:hideErika();" /></div><!--back--> </div><!--right--> <div id="left"> <div class="contenthead"><img src="img/erikaHeader.jpg" alt="Erika Cervantes" width="" height="" /></div><!--contenthead--> <div class="content"> <!--Scrollable iframe script- By Dynamic Drive--> <!--For full source code and more DHTML scripts, visit http://www.dynamicdrive.com--> <!--This credit MUST stay intact for use--> <iframe class="datamain" src="zen/index.php?album=erika" name="bio" width="618" height="330" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" ></iframe> </div><!--content--> <div class="scroll"> <a href="#" onmouseover="scrollspeed=-1" onmousedown="scrollspeed=-2" onmouseout="scrollspeed=0"><img src="img/scrolltop.jpg" alt="scrolltop" width="" height="" /></a><br/><img src="img/scrollmid.jpg" alt="scrollmid" width="" height="" /><br /><a href="#" onmouseover="scrollspeed=1" onmouseout="scrollspeed=0" onmousedown="scrollspeed=2"><img src="img/scrollbottom.jpg" alt="scrollbottom" width="" height="" /></a> </div><!--scroll--> </div><!--left--> </div><!--window erika--> <div class="window" id="production"> <div class="right"> <div class="nav"> <a href="zen/index.php?album=features" target="prod"><img src="img/features_off.jpg" alt="features" width="" height="" /></a> <a href="zen/index.php?album=shorts" target="prod"><img src="img/shorts_off.jpg" alt="shorts" width="" height="" /></a><br /> <a href="zen/index.php?album=web" target="prod"><img src="img/web_off.jpg" alt="web" width="" height="" /></a> <a href="zen/index.php?album=music" target="prod"><img src="img/music_off.jpg" alt="music videos" width="" height="" style="padding-bottom:25px;" /></a> </div><!--nav--> <div class="back"><a href="zen/news" target="prod"><img src="img/back_off.jpg" alt="Back" width="" height="" onclick="javascript:hideProduction();" /></a></div><!--back--> </div><!--right--> <div class="left"> <div class="contenthead"><img src="img/erikatitle.jpg" alt="Erika Cervantes Productions" width="" height="" /></div><!--contenthead--> <div class="content"> <!--Scrollable iframe script- By Dynamic Drive--> <!--For full source code and more DHTML scripts, visit http://www.dynamicdrive.com--> <!--This credit MUST stay intact for use--> <iframe class="datamain" src="zen/news/" name="prod" width="618" height="330" marginwidth="0" marginheight="0" frameborder="0" scrolling="no" ></iframe> </div><!--content--> <div class="scroll"> <a href="#" onmouseover="scrollspeed=-1" onmousedown="scrollspeed=-2" onmouseout="scrollspeed=0"><img src="img/scrolltop.jpg" alt="scrolltop" width="" height="" /></a><br/><img src="img/scrollmid.jpg" alt="scrollmid" width="" height="" /><br /><a href="#" onmouseover="scrollspeed=1" onmouseout="scrollspeed=0" onmousedown="scrollspeed=2"><img src="img/scrollbottom.jpg" alt="scrollbottom" width="" height="" /></a> </div><!--scroll--> </div> <!--left--> </div><!--window production--> </div><!--main--> </body> </html> Thank you very much! Hi, I'm fairly new to javascript, I created a javascript image gallery using a tutorial found on web monkey. Please see below: Code: <script language="JavaScript" type="text/javascript"> <!-- var interval = 1500; var random_display = 0; var image_dir = "images/exhibition/" var ImageNum = 0; imageArray = new Array(); imageArray[ImageNum++] = new imageItem(image_dir + "exhibition-sealskinz.png"); imageArray[ImageNum++] = new imageItem(image_dir + "exhibition-orchard.png"); var number_of_image = imageArray.length; function imageItem(image_location) { this.image_item = new Image(); this.image_item.src = image_location; } function get_ImageItemLocation(imageObj) { return(imageObj.image_item.src) } function randNum(x, y) { var range = y - x + 1; return Math.floor(Math.random() * range) + x; } function getNextImage() { if (random_display) { ImageNum = randNum(0, number_of_image-1); } else { ImageNum = (ImageNum+1) % number_of_image; } var new_image = get_ImageItemLocation(imageArray[ImageNum]); return(new_image); } function getPrevImage() { ImageNum = (ImageNum-1) % number_of_image; var new_image = get_ImageItemLocation(imageArray[ImageNum]); return(new_image); } function prevImage(place) { var new_image = getPrevImage(); document[place].src = new_image; } function rotateImage(place) { var new_image = getNextImage(); document[place].src = new_image; var recur_call = "rotateImage('"+place+"')"; timerID = setTimeout(recur_call, interval); } // --> </script> However unfortunately there are two issues, one is IE6 is coming up with javascript errors and IE7 gets an error when you click the previous button on the first image. The buttons look like this: Code: <div id="left-arrow-container"><a href="#" onClick="prevImage('rImage'); clearTimeout(timerID)"><img src="images/left-arrow.png" alt="left arrow" name="leftarrow" width="58" height="37" border="0" id="leftarrow" /></a></div> <div id="see-the-whole-project"> see the whole project</div> <div id="right-arrow-container"><a href="#" onClick="rotateImage('rImage'); clearTimeout(timerID)"><img src="images/right-arrow.png" alt="right arrow" name="rightarrow" width="58" height="36" border="0" id="rightarrow" /></a></div> Being new to javascript I don't know how to get round these issues so if anyone could advise me I would really appreciate it. Thanks Gary The problem stems from Internet Explorer's inability to expand questions in the FAQ section of my website ( link: http://phonesforyourcharity.com/faq.php ). Of course the expand function works in Firefox and Safari. The <script type="text/javascript" src="js/faq.js"></script> in the source refers to: PHP Code: $(function(){ $("dd.answer") .hide(); $("dl.faq dt") .append("<br /><a href='#' title='Reveal Answer' class='answer-tab'>Answer</a>"); $(".answer-tab") .click(function(){ $(this) .parent().parent() .find("dd.answer") .slideToggle(); return false; }); }); I am using HAPedit for HTML/Javascript and it used to work alright by clicking Display -> Browse with -> Default Browser(Internet Explorer). But since last one or two days it gives the following error "The page cannot be displayed" and the following is shown in the URL bar http://localhost/helloworld.html 2. But, however, if I navigate to the file by using File -> Open of the IE, the result is shown correctly. 3. What has gone wrong?? I have javascript code in my site. It works in FireFox but doesn't work in IE. The page is http://omidpand.ir/search.html First select something from first combobox when u open second combobox the javascript code should change latin characters with persian one, but it doesn't do it. i'm looking for a function to check for the browser version and NOT run a script if the user is using internet explorer 7 or less something like <!--[if gte IE 7]> alert(internet explorer 6 sucks) <!--[else]> alert(internet explorer 7 or greater is better but it still sucks) <![endif]--> and if i just use "lte IE 7" instead of gte IE 7 it will exclude firefox... so that's why i prefer to use a "else" statement.... instead you got something better to suggest thanks!! Hi There, Can anyone explain why the following XMLHttpRequest.open call fails on IE browsers, but works fine in Firefox and Chrome? Code: <html> <head> </head> <script type="text/javascript"> if( window.XMLHttpRequest ) { xhttp=new XMLHttpRequest(); } else { xhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xhttp.open("GET","test.xml",false); // I show an "access is denied error in IE" xhttp.send(""); document.write( xhttp.responseXML.getElementsByTagName("simple")[0].childNodes[0].nodeValue ); </script> <body> </body> </html> The "text.xml" file resides in the same location (local HDD folder on the pc this is running on) as the html page. And the contents of "test.xml" are shown below: Code: <simple> Hello </simple> Obviously its just a very simple example that should just display "Hello" when loaded, but it fails to work in IE. Hi there - I was wondering if anyone out there could help me I'm redoing my site from many years ago - www.industrialarts.co.uk It contains a "Conveyor" - to which I've always wanted to add a "Lightbox" effect. Well - the good news is that I've managed to get a test page up and running and it's doing exactly what I want it to in Firefox, Chrome, Opera and in Safari However .. in Internet Explorer 8 .. it ain't good. The scripts on the page seem not to work at all. (In Internet Explorer 7, it's worse as the formatting is haywire too - but I'll try to fix one thing at a time) http://www.industrialarts.co.uk/test/chairs/chairs.html So - if anybody could be good enough to take a look at my test page and offer any suggestions for getting it running on Internet Explorer too .. or just where to look for answers - I'd be massively grateful My apologies also as I'm a dabbler with this stuff (normally a woodworker) Cheers, Jol hi everyone, I hope you can help me understand why my Javascript menu is different on Chrome browser. It is fine on Internet Explorer. Please see images. Internet Explorer Google Chrome I look forward to hearing from you. Ravi I am hoping that someone can figure out why this simple javascript works fine in Firefox, but not in IE8. I appreciate any help. PS: I see it DOES work in IE9... but I can't use it if I cannot make it work in IE8 as well. Sincerely, Buffmin 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"> <head> <title>test</title> <script type="text/javascript" src="jquery-1.6.2.js"></script> <script type="text/javascript"> $(document).ready(function() { switches = $('#switches > li'); slides = $('#slides > div'); switches.each(function(idx) { $(this).data('slide', slides.eq(idx)); }).hover( function() { switches.removeClass('active'); slides.removeClass('active'); $(this).addClass('active'); $(this).data('slide').addClass('active'); }); }); </script> <style type="text/css"> #switches .active { font-weight: bold; } #slides div { display: none; } #slides div.active { display: block; } </style> </head> <body> <ul id="switches"> <li class="active">First slide</li> <li>Second slide</li> <li>Third slide</li> <li>Fourth slide</li> </ul> <div id="slides"> <div class="active">Well well.</div> <div>Oh no!</div> <div>You again?</div> <div>I'm gone!</div> </div> </body> </html> Hi there i have been looking around the internet for a way to resolve the problem i have, admittedly i may well of read the answer several times but being relatively new to JavaScript i am still unclear on much of the terminology. Well basically my problem is that i have a piece of code which wen tested on my mac i was using Firefox, safari, opera etc. all these worked fine when it came to pc testing with internet explorer i was presented with the following errors..... Error Details: 1) Line:32 Char:16 Error: 'getElementsByTagName(...).0.src' is null or not an object Code:0 URL:http://www.janedelacey.co.uk/html/press.html 2) Line:53 Char:41 Error: Object doesnt support this property or method Code:0 URL:http://www.janedelacey.co.uk/html/press.html The url is a clients webpage i dont think this has any effect on the issue. Here is the code for the page if this helps anyone in helping me resolve the issue! Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <LINK REL="SHORTCUT ICON" HREF="../images/favicon.ico"> <link rel="stylesheet" type="text/css" href="../css/layout.css"> <title> Jane De-Lacey - Press </title> <link rel="shortcut icon" href="favicon.ico" > <meta name="description" content="Jane De Lacey is a freelance lingerie designer and manufacturer using the finest silk to create Bras, Briefs, Camisoles, Slip, Dresses and Sleepmasks. The latest collection is called the 'L.A Collection'. "> <meta name="keywords" content="Jane De Lacey, Jane DeLacey, Lingerie, 100% Silk, Bra, Knickers, Briefs, Slips, Camisoles, Dresses, Sleepmasks, Underwear, Sheer Silk, Chemise"> <!--[if lt IE 8]> <style media="screen,projection" type="text/css"> #jgal1 li { filter: alpha(opacity=40); } #jgal1 li.active, #jgal1 li:hover { filter: alpha(opacity=100); } </style> <![endif]--> <script type="text/javascript">document.write("<style type='text/css'> #press_gallery { display: none; } </style>");</script> <!--[if lt IE 6]><style media="screen,projection" type="text/css">#press_gallery { display: block; }</style><![endif]--> <script type="text/javascript"> var gal1 = { init : function() { if (!document.getElementById || !document.createElement || !document.appendChild) return false; if (document.getElementById('press_gallery')) document.getElementById('press_gallery').id = 'jgal1'; var li = document.getElementById('jgal1').getElementsByTagName('li'); li[0].className = 'active'; for (i=0; i<li.length; i++) { var url = li[i].getElementsByTagName('img')[0].src; var url_array = url.split("/"); var j = url_array.length - 1; var thumb_path = "../images/thumbs/"; li[i].style.backgroundImage = 'url(' + thumb_path + url_array[j] + ')'; li[i].style.backgroundRepeat = 'no-repeat'; li[i].title = li[i].getElementsByTagName('img')[0].alt; gal1.addEvent(li[i],'click',function() { var im = document.getElementById('jgal1').getElementsByTagName('li'); for (j=0; j<im.length; j++) { im[j].className = ''; } this.className = 'active'; }); } }, addEvent : function(obj, type, fn) { if (obj.addEventListener) { obj.addEventListener(type, fn, false); } else if (obj.attachEvent) { obj["e"+type+fn] = fn; obj[type+fn] = function() { obj["e"+type+fn]( window.event ); } obj.attachEvent("on"+type, obj[type+fn]); } } } gal1.addEvent(window,'load', function() { gal1.init(); }); </script> </head> <body> <div id="content"> <div id="navcontainer"> <div id="topbanner"> <a href="home.html"><img src="../images/logo1.gif" border="none" width="380" height="50"alt="Home - Jane DeLacey"/></a> </div> <ul id="nav"> <li id="nav-home"><a href="home.html">Home</a></li> <li id="nav-shop"><a href="shop.html">Collections</a></li> <li id="nav-press"><a href="press.html">Press</a></li> <li id="nav-about"><a href="about.html">About Us</a></li> <li id="nav-contact"><a href="contact.html">Contact Us</a></li> </ul> </div> <div id="product"> <div id="product_graf"> <img src="../images/top_lines.gif" alt="Side Graphic" height="300px"> </div> <div id="press"> <div id="press_text"> click logo to view image, click image to enlarge </div> <div id="press_pics"> <ul id="press_gallery"> <li><a href="../images/press/marieclaire.jpg"><img src="../images/press/marieclaire.jpg"width="475px" height="500px" alt="Marie Claire featuring Victoria Beckham" border="none" ></a></li> <li><a href="../images/press/vogue1.jpg"<img src="../images/press/vogue1.jpg"width="350px" height="500px" alt="Vogue" border="none"></a></li> <li><a href="../images/press/elle1.jpg"<img src="../images/press/elle1.jpg"width="350px" height="500px" alt="ELLE" border="none" ></a></li> <li><a href="../images/press/wwd1.jpg"<img src="../images/press/wwd1.jpg"width="350px" height="500px" alt="Womens Wear Daily" border="none" ></a></li> <li><a href="../images/press/brides.jpg"<img src="../images/press/brides.jpg" width="350px" height="500px"alt="Brides" border="none" ></a></li> <li><a href="../images/press/wwd2.jpg"<img src="../images/press/wwd2.jpg" width="350px" height="500px"alt="ELLE" border="none" ></a></li> <li><a href="../images/press/elle2.jpg"<img src="../images/press/elle2.jpg" width="350px" height="500px"alt="ELLE" border="none" ></a></li> <li><a href="../images/press/hg.jpg"<img src="../images/press/hg.jpg" width="350px" height="500px"alt="Homes and Gardens" border="none" ></a></li> <li><a href="../images/press/vogue2.jpg"<img src="../images/press/vogue2.jpg" width="350px" height="500px"alt="Vogue" border="none" ></a></li> <li><a href="../images/press/wwd3.jpg"<img src="../images/press/wwd3.jpg" width="350px" height="500px"alt="Womens Wear Daily" border="none" ></a></li> <li><a href="../images/press/elle3.jpg"<img src="../images/press/elle3.jpg" width="350px" height="500px"alt="ELLE" border="none" ></a></li> <li><a href="../images/press/status1.jpg"<img src="../images/press/status1.jpg" width="350px" height="500px"alt="Status" border="none" ></a></li> <li><a href="../images/press/elle4.jpg"<img src="../images/press/elle4.jpg"width="500px" height="350px" alt="ELLE" border="none" ></a></li> <li><a href="../images/press/wwd4.jpg"<img src="../images/press/wwd4.jpg"width="350px" height="500px" alt="Womens Wear Daily" border="none" ></a></li> <li><a href="../images/press/status2.jpg"<img src="../images/press/status2.jpg" width="350px" height="500px"alt="Status" border="none" ></a></li> <li><a href="../images/press/fashiondaily.jpg"<img src="../images/press/fashiondaily.jpg" width="500px" height="350px"alt="Fashion Daily" border="none" ></a></li> <li><a href="../images/press/eve.jpg"<img src="../images/press/eve.jpg" width="350px" height="500px"alt="Eve" border="none" ></a></li> <li><a href="../images/press/observer.jpg"<img src="../images/press/observer.jpg" width="350px" height="500px"alt="Observer Magazine" border="none" ></a></li> <li><a href="../images/press/telegraph.jpg"<img src="../images/press/telegraph.jpg" width="350px" height="500px"alt="Telegraph" border="none" ></a></li> <li><a href="../images/press/financialtimes.jpg"<img src="../images/press/financialtimes.jpg" width="350px" height="500px"alt="Financial Times" border="none" ></a></li> <li><a href="../images/press/linbuyer.jpg"<img src="../images/press/linbuyer.jpg" width="350px" height="500px"alt="Lingerie Buyer Blog" border="none" ></a></li> <li><a href="../images/press/juice1.jpg"<img src="../images/press/juice1.jpg" width="350px" height="500px"alt="Juice Brighton Magazine" border="none" ></a></li> <li><a href="../images/press/ideal.jpg"<img src="../images/press/ideal.jpg" width="350px" height="500px"alt="Ideal" border="none" ></a></li> <li><a href="../images/press/drapers.jpg"<img src="../images/press/drapers.jpg" width="500px" height="200px"alt="Drapers" border="none" ></a></li> <li><a href="../images/press/juice2.jpg"<img src="../images/press/juice2.jpg" width="500px" height="350px"alt="Juice Brighton Magazine" border="none" ></a></li> </ul> </div> <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/> </div> <div id="footer"> <ul id="footer_nav"> <li><a href="terms.html">terms & conditions</a></li> <li><a href="delivery.html">delivery</a></li> <li><a href="acknowledge.html">acknowledgments</a></li> <li><a href="contact.html">contact us</a></li> </ul> </div> </div> </div> </body> </html> I know most of this code will not be relevant but i thought adding the whole pages code made more sense? Thank you in advance for any help received! Tom Hello, I'm new to Javascript programming. I have designed a Javascript to carry information from one page to another. It works fine in firefox but does not work in internet explorer. Is there some coding that needs to be specified for my script to work in ie? Thanks Hello, im new and hope you can help me out. I am running some javascript on my vbulletin forum. One is for some ad network to display ads, I noticed this working in firefox and chrome but not IE. After some investigation I realised my analytics javascript snippet is conflicting, if i remove the javascript for my analytics then the ads show in all web browsers. The two pieces of code a Analytics; Code: <script src="/mint/?js" type="text/javascript"></script> Ad network; Code: <script type="text/javascript"> var EB_campid='5336510241'; </script> <script src="http://www.zintext.com/showads.js" type="text/javascript"></script> Any help appreciated. Dave. I am making a web page, and as part of it I have a table that the user can add rows to. My code works in FF and Chrome, but IE is broken. Code: function addrow() { var example=document.getElementById("new"); var addHere=document.getElementById("ticketTable"); var node= example.cloneNode(true); node.id="added"; addHere.appendChild(node); } This code is called when a button is clicked. new is the ID of the row I am adding, and ticketTable is the ID of the table I am adding to. Help please! Hello, I have a xmlHttpRequest that was working in Internet explore 6,7 and now is broken in the new Internet explore 8. Can anyone help me pinpoint the problem here? The Error console says this. Invalid procedure call or argument: Code: req.base_open('get', ginf.host + '/includes/process.php?action=jstest&' + failures, true); Screen Captu http://i31.tinypic.com/2v81rg6.jpg This works in Firefox and the older Internet explorers. So I"m not sure what Microsoft did with Internet Exploder 8. Is there syntax error or something with it that the other browser ignored? What is wrong with it? This is the full javascript file if you like to look. http://pastebin.ca/1515445 hey just wondering if anyone could help me with a problem im having with this menu for a website i got a chained menu javascript downloaded and all the data entered for it it will work in firefox but wont in internet explorer and i just dont understand why http://www.jomcfall97.talktalk.net/index1.html its the menu on the right hand side this is the error message Message: Object doesn't support this property or method Line: 247 Char: 5 Code: 0 URI: http://www.jomcfall97.talktalk.net/chainedmenu.js Here are lines 244 - 248 function initListGroup(n) { var _content=cs_findContent(n), count=0; if (_content!=null) { content=new cs_contentOBJ("cs_"+n,_content.menu); cs_content[cs_content.length]=content; and heres the full chainedmenu.js Code: var _disable_empty_list=false; var _hide_empty_list=false; var onclickaction="alert" function goListGroup(){ for (i=arguments.length-1;i>=0; i--){ if (arguments[i].selectedIndex!=-1){ var selectedOptionvalue=arguments[i].options[arguments[i].selectedIndex].value if (selectedOptionvalue!=""){ if (onclickaction=="alert") alert(selectedOptionvalue) else if (newwindow==1) window.open(selectedOptionvalue) else window.location=selectedOptionvalue break } } } } if (typeof(disable_empty_list)=="undefined") { disable_empty_list=_disable_empty_list; } if (typeof(hide_empty_list)=="undefined") { hide_empty_list=_hide_empty_list; } var cs_goodContent=true, cs_M="M", cs_L="L", cs_curTop=null, cs_curSub=null; function cs_findOBJ(obj,n) { for (var i=0; i<obj.length; i++) { if (obj[i].name==n) { return obj[i]; } } return null; } function cs_findContent(n) { return cs_findOBJ(cs_content,n); } function cs_findM(m,n) { if (m.name==n) { return m; } var sm=null; for (var i=0; i<m.items.length; i++) { if (m.items[i].type==cs_M) { sm=cs_findM(m.items[i],n); if (sm!=null) { break; } } } return sm; } function cs_findMenu(n) { return (cs_curSub!=null && cs_curSub.name==n)?cs_curSub:cs_findM(cs_curTop,n); } function cs_contentOBJ(n,obj){ this.name=n; this.menu=obj; this.lists=new Array(); this.cookie=""; }; cs_content=new Array(); function cs_topmenuOBJ(tm) { this.name=tm; this.items=new Array(); this.df=0; this.addM=cs_addM; this.addL=cs_addL; } function cs_submenuOBJ(dis,link,sub) { this.name=sub; this.type=cs_M; this.dis=dis; this.link=link; this.df=0; var x=cs_findMenu(sub); this.items=x==null?new Array():x.items; this.addM=cs_addM; this.addL=cs_addL; } function cs_linkOBJ(dis,link) { this.type=cs_L; this.dis=dis; this.link=link; } function cs_addM(dis,link,sub) { this.items[this.items.length]=new cs_submenuOBJ(dis,link,sub); } function cs_addL(dis,link) { this.items[this.items.length]=new cs_linkOBJ(dis,link); } function cs_showMsg(msg) { window.status=msg; } function cs_badContent(n) { cs_goodContent=false; cs_showMsg("["+n+"] Not Found."); } function cs_optionOBJ(text,value) { this.text=text; this.value=value; } function cs_emptyList(list) { for (var i=list.options.length-1; i>=0; i--) { list.options[i]=null; } } function cs_refreshList(list,opt,df) { cs_emptyList(list); for (var i=0; i<opt.length; i++) { list.options[i]=new Option(opt[i].text, opt[i].value); } if (opt.length>0) { list.selectedIndex=df; } } function cs_getOptions(menu) { var opt=new Array(); for (var i=0; i<menu.items.length; i++) { opt[i]=new cs_optionOBJ(menu.items[i].dis, menu.items[i].link); } return opt; } function cs_updateListGroup(content,idx,sidx,mode) { var i=0, curItem=null, menu=content.menu; while (i<idx) { menu=menu.items[content.lists[i++].selectedIndex]; } if (menu.items[sidx].type==cs_M && idx<content.lists.length-1) { var df=cs_getIdx(mode,content.cookie,idx+1,menu.items[sidx].df); cs_refreshList(content.lists[idx+1], cs_getOptions(menu.items[sidx]), df); if (content.cookie) { cs_setCookie(content.cookie+"_"+(idx+1),df); } if (idx+1<content.lists.length) { if (disable_empty_list) { content.lists[idx+1].disabled=false; } if (hide_empty_list) { content.lists[idx+1].style.display=""; } cs_updateListGroup(content,idx+1,df,mode); } } else { for (var s=idx+1; s<content.lists.length; s++) { cs_emptyList(content.lists[s]); if (disable_empty_list) { content.lists[s].disabled=true; } if (hide_empty_list) { content.lists[s].style.display="none"; } if (content.cookie) { cs_setCookie(content.cookie+"_"+s,""); } } } } function cs_initListGroup(content,mode) { var df=cs_getIdx(mode,content.cookie,0,content.menu.df); cs_refreshList(content.lists[0], cs_getOptions(content.menu), df); if (content.cookie) { cs_setCookie(content.cookie+"_"+0,df); } cs_updateListGroup(content,0,df,mode); } function cs_updateList() { var content=this.content; for (var i=0; i<content.lists.length; i++) { if (content.lists[i]==this) { if (content.cookie) { cs_setCookie(content.cookie+"_"+i,this.selectedIndex); } if (i<content.lists.length-1) { cs_updateListGroup(content,i,this.selectedIndex,""); } } } } function cs_getIdx(mode,name,idx,df) { if (mode) { var cs_idx=cs_getCookie(name+"_"+idx); if (cs_idx!="") { df=parseInt(cs_idx); } } return df; } function _setCookie(name, value) { document.cookie=name+"="+value; } function cs_setCookie(name, value) { setTimeout("_setCookie('"+name+"','"+value+"')",0); } function cs_getCookie(name) { var cookieRE=new RegExp(name+"=([^;]+)"); if (document.cookie.search(cookieRE)!=-1) { return RegExp.$1; } else { return ""; } } // ---- function addListGroup(n,tm) { if (cs_goodContent) { cs_curTop=new cs_topmenuOBJ(tm); cs_curSub=null; var c=cs_findContent(n); if (c==null) { cs_content[cs_content.length]=new cs_contentOBJ(n,cs_curTop); } else { delete(c.menu); c.menu=cs_curTop; } } } function addList(n,dis,link,sub,df) { if (cs_goodContent) { cs_curSub=cs_findMenu(n); if (cs_curSub!=null) { cs_curSub.addM(dis,link||"",sub); if (typeof(df)!="undefined") { cs_curSub.df=cs_curSub.items.length-1; } } else { cs_badContent(n); } } } function addOption(n,dis,link,df) { if (cs_goodContent) { cs_curSub=cs_findMenu(n); if (cs_curSub!=null) { cs_curSub.addL(dis,link||""); if (typeof(df)!="undefined") { cs_curSub.df=cs_curSub.items.length-1; } } else { cs_badContent(n); } } } function initListGroup(n) { var _content=cs_findContent(n), count=0; if (_content!=null) { content=new cs_contentOBJ("cs_"+n,_content.menu); cs_content[cs_content.length]=content; for (var i=1; i<initListGroup.arguments.length; i++) { if (typeof(arguments[i])=="object" && arguments[i].tagName && arguments[i].tagName=="SELECT") { content.lists[count]=arguments[i]; arguments[i].onchange=cs_updateList; arguments[i].content=content; arguments[i].idx=count++; } } if (content.lists.length>0) { cs_initListGroup(content,content.cookie); } } } function resetListGroup(n) { var content=cs_findContent("cs_"+n); if (content!=null && content.lists.length>0) { cs_initListGroup(content,""); } } any help appreciated as ive just come to a standstill over this thanks Hey everyone, this problem has been bothering me for awhile, so I decided to finally stop banging my head against a wall over it and seek out some help. I'm fairly new to web development, but through W3Schools and the almighty Google, I managed to make my way through developing a site for the company that I intern for. The site is designed to query a Microsoft Access database and display the results, so employees can see the results of tests run on another machine in a different area. I did not design the database or queries for this project, but assume that they function as they are supposed to. The way the website works is by displaying a form to the user with a number of check boxes (it varies by page) that each add another parameter to the query. When the query button is clicked, I used the "onclick" action of an HTML button to send the form data to a JavaScript function to be processed. The JavaScript function filters out what I need to send to a php page that runs the query. I send the information from the JavaScript function using an XMLHttpRequest, and replace a line of text in the HTML document with the returned results from the php script. I have tested the completed website in several browsers. It works flawlessly in Chrome, Firefox, and IE9. The problem is, it doesn't work with IE7 or IE8, and even though the company I work for is making a widespread upgrade to Windows 7 from XP within the year, they don't plan on moving beyond IE8. When I load the page in IE8 (I'm running WAMP as my server), I can see that my php scripts work just fine, because some of the fields used to configure the query are generated using php, and they appear as they should. However, when I click the form button that triggers the JavaScript function, nothing happens (IE7 and 8 both report "Error on Page"). I've gone through nearly every Internet Options settings, as far as I know, and I'm fairly certain that every setting related to scripting is enabled, though I've only tried testing the site on IE7 and 8 at work and not at home (where I have unlimited security access). Below is the HTML for the button that triggers the JavaScript function, "displayTable": Code: <input type="button" name="button" value="Show Results" onclick="displayTable(this.form)" /> I'm not sure how easily this problem can be fixed, so if anyone needs to see any other bits of code, I can provide those. But my main question is, does this sound like just some setting in IE7/8 that I don't know about (keeping in mind that, with all the settings the same, the site works fine in IE9), or does IE7/8 simply have some inherent flaw in interpreting JavaScript, and will it be necessary for me to rewrite my code taking some other approach, and if so, what language would be recommended in place of JavaScript in IE7/8? Thanks! I have the following Javascript function that just refuses to work in Internet Explorer (since IE is absolute .......). Can anybody tell me why this wouldn't be working in IE and what I need to do to fix it? I am new to Javascript so don't really have any idea Code: function displaymember() { var d = new Date(); var curr_date = d.getDate(); if (curr_date < 10) curr_date = "0" + curr_date; var curr_month = d.getMonth(); curr_month++; if (curr_month < 10) curr_month = "0" + curr_month; var curr_year = d.getFullYear(); //alert("date="+curr_date+" month="+curr_month+" year="+curr_year); for (i = 0; i < x.length; i++) { membershipstatus = (x[i].getElementsByTagName("membership_status")[0].childNodes[0].nodeValue); name = (x[i].getElementsByTagName("name")[0].childNodes[0].nodeValue); body = (x[i].getElementsByTagName("body_type")[0].childNodes[0].nodeValue); ethnicity = (x[i].getElementsByTagName("ethnicity")[0].childNodes[0].nodeValue); sex = (x[i].getElementsByTagName("sex")[0].childNodes[0].nodeValue); profession = (x[i].getElementsByTagName("profession")[0].childNodes[0].nodeValue); seeking = (x[i].getElementsByTagName("seeking")[0].childNodes[0].nodeValue); date = (x[i].getElementsByTagName("date_joined")[0]); month = (date.getElementsByTagName("month")[0].childNodes[0].nodeValue); year = (date.getElementsByTagName("year")[0].childNodes[0].nodeValue); newa = document.createElement('a'); aIdName = 'my' + i + 'a'; ahref = '#'; aclick = 'show(' + i + ')'; newa.setAttribute('id', aIdName); newa.setAttribute('href', ahref); newa.setAttribute('onclick', aclick); newa.innerHTML = name + " | " + body + " " + ethnicity + " " + sex + " " + profession + " with " + membershipstatus + " membership seeks " + seeking + "<br/>"; if (curr_month == month && curr_year == year) { document.getElementById("member").appendChild(newa); } } } I've got a flash music player (audioplay) on a site (yeah, I know, I hate music on websites too, but the client wants it). I'm using javascript to trigger "stop" and "play" and it works on every browser except IE 9+. The error in IE's developer says: SCRIPT438: Object doesn't support property or method 'stopMusic' Here's the javascript: Code: <script language="JavaScript" type="text/javascript"> function getPlayer(movieName) { if (navigator.appName.indexOf("Microsoft") != -1) { return window[movieName]; } else { return document[movieName]; } } function play2() { getPlayer('player2').playMusic(); } function stop2() { getPlayer('player2').stopMusic(); } </script> Here's the working example: EXAMPLE Sorry fellas, I am a complete noob I am trying to detect if a users browser is Internet Explore Version 9 the subsequently redirect that browser to a new page that is IE 9 specific in my directory. My code does NOT seem to be working. Could any of you kind folks take a look and see the mistake? <script language="JavaScript" type="text/JavaScript"> if(navigator.appName == "Microsoft Internet Explorer"&& navigator.appVersion >=8) { window.location = "SeansWebsite_2012_IE9.html" } <!-- the page that i am starting on is "SeansWebsite_2012.html"--> </script> |