JavaScript - Image Not Displaying In Some Browsers
I have the following code to display an image (and link if there is one):
Code: if (ads[adNumber].href) { tempCode += ('<a href="'+ ads[adNumber].href +'" target=_blank "> \n') tempCode += ('<img src="' + ads[adNumber].src + '" width=' + ads[adNumber].width) tempCode += (' onLoad="setTimeout(\'newAd();\',' + refreshTime + ');"') tempCode += ('\n height=' + ads[adNumber].height + ' border=0 >') tempCode += ('</a>') } else { tempCode += ('<img src="' + ads[adNumber].src + '" width=' + ads[adNumber].width) tempCode += (' onLoad="setTimeout(\'newAd();\',' + refreshTime + ');"') tempCode += ('\n height=' + ads[adNumber].height + ' border=0 >') } return tempCode; This works OK in IE9 but only shows the image if there is no link in IE7 (that is, if (ads[adNumber].href) is not true). Thanks for any help! Similar TutorialsHi, I'm having problems displaying images on a site. Basically I have a to change an image each time a button is pressed on a piece of hardware. This is the code to detect a button press Code: // Check Button tstileo = new Image(); tstilec = new Image(); tstileo.src = '/images/1.jpg'; tstilec.src = '/images/2.jpg'; document.getElementById('btn0').innerHTML = (getXMLValue(xmlData, 'btn0') == 'up') ? document.Image=(tstileo): document.Image=(tstilec); So when the button is pressed/unpressed it should display tstileo and tstilec What format should my HTML code be to display the image ? This is whats there at the moment Code: <span id="btn0">?</span></p> When running all I get is text saying Code: [OBJECT HTMLImageElement] This site is being hosted on a microchip, btn0 is a press button switch on the board. The idea is to use this as a remote monitoring system. It runs Javascript XML HTML and CSS. Any help would be greatly appreciated, I have spent hours searching for a way to do this ( simple ? ) task but haven't got any further than this. Thanks Jay Hi guys, I already posted this but it hasn't been approved by a mod or the mods are all at lunch or something lol. I want to display an image using javascript instead of HTML (or use javascript to change the HTML code dynamically when an update is made). I have created an XML file, which contains text data which is displayed in HTML by using Javascript. What I am having trouble with is getting Javascript to grab the image URL from the XML file, and then display that image in the correct div. How does one show an image by using javascript? and how do you get javascript to get the url from the XML? The following is my Javascript code which grabs the text from the XML and displays it in the HTML; Code: <script type="text/javascript"> var xmlDoc; <!-- if (window.XMLHttpRequest) { xhttp=new XMLHttpRequest(); } else // Internet Explorer 5/6 { xhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xhttp.open("GET","SDS.xml",false); xhttp.send(""); xmlDoc=xhttp.responseXML; var x=xmlDoc.getElementsByTagName("NEWS"); i=0; function display() { title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue.fontsize("5").fontcolor("white").bold()); date=(x[i].getElementsByTagName("DATE")[0].childNodes[0].nodeValue.fontsize("2").fontcolor("white").bold()); stitle=(x[i].getElementsByTagName("STITLE")[0].childNodes[0].nodeValue.fontsize("3").fontcolor("white").italics()); story=(x[i].getElementsByTagName("STORY")[0].childNodes[0].nodeValue.fontsize("3").fontcolor("white")); txt= title + "<br />" + date + "<br />" + stitle + "<br />" + story; document.getElementById("show").innerHTML=txt; } //--> </script> And this is the XML file; Code: <?xml version="1.0" encoding="ISO-8859-1"?> <BULLETIN> <NEWS> <PIC>"newssmall.jpg"</PIC> <DATE>14/3/2010</DATE> <TITLE>News Story 1</TITLE> <STITLE>This is a short sentence to describe the story in brief</STITLE> <STORY>This is the text of the news story</STORY> </NEWS> </BULLETIN> So what I want to do is create a function that grabs the url (relative) from the PIC tag in the XML ("newssmall.jpg") and then uses this URL to display the image on the HTML page. This way, only the XML needs updating when updating the news section of the site. Thanks for helping if you can, Dan Hello everyone, my 1st post here and my 1st day with javascript! I am having some problems with the below script: Code: <html> <head> <title></title> <script type="text/javascript"> var electronics = ["mobiles", "hi-fi"]; var entertainment = ["books", "dvds",]; function check(checkboxid) { document.getElementById(checkboxid).checked = "checked"; } function visiblox(arrDiv, hs) { var disp = (hs) ? "none" : "block"; for(var x = 0; x < arrDiv.length; x++) { document.getElementById(arrDiv[x]).style.display = disp; } } function chk(what, item) { if(item) { visiblox(what, false); } else { visiblox(what, true); } } </script> <style type="text/css"> <!-- .hide { display: block; } .hide { display: none; } --> </style> </head> <body> <img src="images/electronics.png" onclick="check('electronics');"> <input type="checkbox" id="electronics" onchange="chk(electronics, this.checked);" > <br> <input type="checkbox" onclick="chk(entertainment, this.checked);"> Entertainment<br> <br> <br> <div id="mobiles" class="hide">Mobiles</div><br> <div id="hi-fi" class="hide">Hi-Fi</div><br> <div id="books" class="hide">Books</div><br> <div id="dvds" class="hide">DVD's</div><br> </body> </html> Basically what happens is, when you select a checkbox it displays the relevant divs, this works fine with the entertainment checkbox in the code. What I am trying to achieve is use an image to trigger the checkbox (which will be hidden) and the run the chk code to display the divs What actually happens when you click the image the checkbox does become checked, however the divs do not display, if I uncheck the checkbox itself and then check the actual checkbox then it works. Basically getting very frustrated as I can't seem to see whats wrong! I am guessing that for some reason the check code stops the chk running, but I dont know why! Many thanks for any help Hello and thanks for the help. I'm no expert by any means, and I have no idea what the problem could be. Internet Explorer crops my images on my image fade, but Chrome and Safari view it just fine. the website is www.pisanchynproductions.com If you open it in IE and Chrome you can see Chrome shows image fadeshow fine, and IE crops the images. For the record, I don't want the images cropped. The problem must be in here somewhere. Code: var fadeimages=new Array() //SET IMAGE PATHS. Extend or contract array as needed fadeimages[0]=["images/SSPP1.JPG", "", ""] //plain image syntax fadeimages[1]=["images/SSPP2.JPG", "", ""] //plain image syntax fadeimages[2]=["images/SSPP3.JPG", "", ""] //plain image syntax fadeimages[3]=["images/SSPP4.JPG", "", ""] //plain image syntax fadeimages[4]=["images/SSPP5.JPG", "", ""] //plain image syntax fadeimages[5]=["images/SSPP6.JPG", "", ""] //plain image syntax fadeimages[6]=["images/SSPP7.JPG", "", ""] //plain image syntax fadeimages[7]=["images/SSPP11.JPG", "", ""] //plain image syntax fadeimages[8]=["images/SSPP12.JPG", "", ""] //plain image syntax fadeimages[9]=["images/SSPP13.JPG", "", ""] //plain image syntax fadeimages[10]=["images/SSPP14.JPG", "", ""] //plain image syntax var fadebgcolor="white" var fadearray=new Array() //array to cache fadeshow instances var fadeclear=new Array() //array to cache corresponding clearinterval pointers var dom=(document.getElementById) //modern dom browsers var iebrowser=document.all function fadeshow(theimages, fadewidth, fadeheight, borderwidth, delay, pause, displayorder){ this.pausecheck=pause this.mouseovercheck=0 this.delay=delay this.degree=10 //initial opacity degree (10%) this.curimageindex=0 this.nextimageindex=1 fadearray[fadearray.length]=this this.slideshowid=fadearray.length-1 this.canvasbase="canvas"+this.slideshowid this.curcanvas=this.canvasbase+"_0" if (typeof displayorder!="undefined") theimages.sort(function() {return 0.5 - Math.random();}) this.theimages=theimages this.imageborder=parseInt(borderwidth) this.postimages=new Array() //preload images for (var p=0;p<theimages.length;p++){ this.postimages[p]=new Image() this.postimages[p].src=theimages[p][0] } var fadewidth=fadewidth+this.imageborder*2 var fadeheight=fadeheight+this.imageborder*2 if (iebrowser&&dom||dom) //if IE5+ or modern browsers (ie: Firefox) document.write('<div id="master'+this.slideshowid+'" style="position:relative;width:'+fadewidth+'px;height:'+fadeheight+'px;overflow;"><div id="'+this.canvasbase+'_0" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div><div id="'+this.canvasbase+'_1" style="position:absolute;width:'+fadewidth+'px;height:'+fadeheight+'px;top:0;left:0;filter:progid:DXImageTransform.Microsoft.alpha(opacity=10);opacity:0.1;-moz-opacity:0.1;-khtml-opacity:0.1;background-color:'+fadebgcolor+'"></div></div>') else document.write('<div><img name="defaultslide'+this.slideshowid+'" src="'+this.postimages[0].src+'"></div>') if (iebrowser&&dom||dom) //if IE5+ or modern browsers such as Firefox this.startit() else{ this.curimageindex++ setInterval("fadearray["+this.slideshowid+"].rotateimage()", this.delay) } } function fadepic(obj){ if (obj.degree<100){ obj.degree+=10 /*@cc_on @*/ /*@if(@_jscript_version >= 5) try{ @end @*/ if (obj.tempobj.filters&&obj.tempobj.filters[0]){ if (typeof obj.tempobj.filters[0].opacity=="number") //if IE6+ obj.tempobj.filters[0].opacity=obj.degree else //else if IE5.5- obj.tempobj.style.filter="alpha(opacity="+obj.degree+")" } else if (obj.tempobj.style.MozOpacity) obj.tempobj.style.MozOpacity=obj.degree/101 else if (obj.tempobj.style.KhtmlOpacity) obj.tempobj.style.KhtmlOpacity=obj.degree/100 else if (obj.tempobj.style.opacity&&!obj.tempobj.filters) obj.tempobj.style.opacity=obj.degree/101 /*@cc_on @*/ /*@if(@_jscript_version >= 5) } catch(e){} @end @*/ } else{ clearInterval(fadeclear[obj.slideshowid]) obj.nextcanvas=(obj.curcanvas==obj.canvasbase+"_0")? obj.canvasbase+"_0" : obj.canvasbase+"_1" obj.tempobj=iebrowser? iebrowser[obj.nextcanvas] : document.getElementById(obj.nextcanvas) obj.populateslide(obj.tempobj, obj.nextimageindex) obj.nextimageindex=(obj.nextimageindex<obj.postimages.length-1)? obj.nextimageindex+1 : 0 setTimeout("fadearray["+obj.slideshowid+"].rotateimage()", obj.delay) } } fadeshow.prototype.populateslide=function(picobj, picindex){ var slideHTML="" if (this.theimages[picindex][1]!="gallery") //if associated link exists for image slideHTML='<a href="'+this.theimages[picindex][1]+'" rel="nofollow" target="'+this.theimages[picindex][2]+'">' slideHTML+='<img src="'+this.postimages[picindex].src+'" border="'+this.imageborder+'px">' if (this.theimages[picindex][1]!="gallery") //if associated link exists for image slideHTML+='</a>' picobj.innerHTML=slideHTML } fadeshow.prototype.rotateimage=function(){ if (this.pausecheck==1) //if pause onMouseover enabled, cache object var cacheobj=this if (this.mouseovercheck==1) setTimeout(function(){cacheobj.rotateimage()}, 100) else if (iebrowser&&dom||dom){ this.resetit() var crossobj=this.tempobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas) crossobj.style.zIndex++ if(document.getElementById('content')) document.getElementById('content').style.zIndex++ fadeclear[this.slideshowid]=setInterval("fadepic(fadearray["+this.slideshowid+"])",50) this.curcanvas=(this.curcanvas==this.canvasbase+"_0")? this.canvasbase+"_1" : this.canvasbase+"_0" } else{ var ns4imgobj=document.images['defaultslide'+this.slideshowid] ns4imgobj.src=this.postimages[this.curimageindex].src } this.curimageindex=(this.curimageindex<this.postimages.length-1)? this.curimageindex+1 : 0 } fadeshow.prototype.resetit=function(){ this.degree=10 var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas) /*@cc_on @*/ /*@if(@_jscript_version >= 5) try{ @end @*/ if (crossobj.filters&&crossobj.filters[0]){ if (typeof crossobj.filters[0].opacity=="number") //if IE6+ crossobj.filters(0).opacity=this.degree else //else if IE5.5- crossobj.style.filter="alpha(opacity="+this.degree+")" } else if (crossobj.style.MozOpacity) crossobj.style.MozOpacity=this.degree/101 else if (crossobj.style.KhtmlOpacity) crossobj.style.KhtmlOpacity=this.degree/100 else if (crossobj.style.opacity&&!crossobj.filters) crossobj.style.opacity=this.degree/101 /*@cc_on @*/ /*@if(@_jscript_version >= 5) }catch(e){} @end @*/ } fadeshow.prototype.startit=function(){ var crossobj=iebrowser? iebrowser[this.curcanvas] : document.getElementById(this.curcanvas) this.populateslide(crossobj, this.curimageindex) if (this.pausecheck==1){ //IF SLIDESHOW SHOULD PAUSE ONMOUSEOVER var cacheobj=this var crossobjcontainer=iebrowser? iebrowser["master"+this.slideshowid] : document.getElementById("master"+this.slideshowid) crossobjcontainer.onmouseover=function(){cacheobj.mouseovercheck=1} crossobjcontainer.onmouseout=function(){cacheobj.mouseovercheck=0} } this.rotateimage() } I wish i knew more so I could realized how dumb this question was. Ahoy, Lemme try to explain this as best as I can. Bullet points might help: When someone clicks on an image here (http://gta.kwivia.co.uk/gta-iv/), the rest of the images collapse and become invisible Below the image, some links appear Also, there will be a "show other images" button which will then show the rest of the images http://gta.kwivia.co.uk/gta-iv/ I will appreciate all solutions to this problem. If you need to know anything, simply ask me. Ok so i have wrote some code which can be seen he http://www.runningprofiles.com/members/include/test.php This works great but when i add the code to the page i want it on (include "include/test.php" for some reason the code does not work... the text is delayed and then lags behind the images.. this can been seen here http://www.runningprofiles.com/members/ I have no idea why its happening! Code for the code is Code: <html> <head> <title>http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q__26659912.html</title> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script> <script type="text/javascript"> function advance() { $("#slideshow").cycle("next"); cycleCaption(); } var displayedIndex = 0 function cycleCaption() { $("#caption").children().each( function(index) { $(this).css("font-weight", (index==displayedIndex)? "bold" : "normal" ); }); displayedIndex = (++displayedIndex==$("#caption").children().length)? 0 : displayedIndex; } $(function() { $("#slideshow").cycle({ timeout: 0 }); $("img").each( function() { $("<div />").html($(this).attr("title")).appendTo($("#caption")); }); cycleCaption(); setInterval( "advance()", 2000 ); }); </script> </head> <body> <div id="slideshow" style="float: left;"> <img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14882_jruqg6x4uu6frw2g872b.jpg" title="Aisling Cuffe Before Foot Locker" /> <img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14879_mzcgn05auhs24fnsygc1.jpg" title="Foot Locker Ballerness" /> <img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14880_u1npsmglw7b9t6hmoqhu.jpg" title="Foot Locker The Rocket" /> <img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14887_9bblfhhvc0x66vebgjua.jpg" title="NCAA D2 Cro" /> <img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14884_mud4ewe6uh6ihrrpux6g.jpg" title="NXN Recap and Results" /> <img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14865_y1kt8vzejkvz25k075x2.jpg" title="Give Your " /> <img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14877_1mlnygbenofquj5h3mcz.jpg" title="NCAA D2 XC Champ" /> <img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14855_9g971maove1jyos0h9zk.jpg" title="Defending" /> <img src="http://c0205112.cdn.cloudfiles.rackspacecloud.com/14850_6u22ylfzym7sxq1zw8p8.jpg" title="NXN 121" /> </div> <div id="caption" style="float: left;"> </div> </body> </html> Any ideas on how I can make this work in IE as well?? It is a code that shows a divide on click and then hides the rest at the same time. live code is also at chryscreations.com/ns/boynames.html Javascript: Code: function showstuff(divID) { els=document.getElementsByName('mydiv') for (var i = 0; i < els.length; i++) { els[i].style.visibility="hidden"; els[i].style.display="none"; } document.getElementById(divID).style.visibility="visible"; document.getElementById(divID).style.display="block"; } HTML Code: <head> <script> window.onload=function() { showstuff(''); } </script> </head> <body> <a href="javascript:showstuff('adivide')">A</a> <a href="javascript:showstuff('bdivide')">B</a> <div name="mydiv" id="adivide"></div> <div name="mydiv" id="bdivide"></div> <body> I feel a little stupid to ask this question but it has always been on my mind. <html> <head> <script type="text/javascript"> { var lastMod = new Date (document.lastModified); document.write ("<p>Document last modified "); document.write ((lastMod.getMonth() +1) + "-" + lastMod.getDate() + "-" + lastMod.getFullYear()); document.write ("<p>"); } </script> </head> </html> when i open in ie or ff it renders 2/25/11 (supposed to be 2/26/11) but when i use it in chrome or an html test is renders correctly. why? Hey everyone, So I just got my DIV named ".center2" to autoscroll. Well, it works when I view it live on Dreamweaver CS5, but when I open it on Safari...nothing. Could anyone help me optimize the code for all web browsers? Thanks! The targeted code is marked in red: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <script type="text/javascript"> function MM_swapImgRestore() { //v3.0 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++) if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}} } function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);} if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } var defaultStep=1; var step=defaultStep; var timer; function scrollDiv(id,s){ var obj=document.getElementById(id); var iScrollTop = obj.scrollTop; step=s||step; if (iScrollTop == 0){ step=defaultStep; } else if (obj.clientHeight + iScrollTop - obj.scrollHeight==0){ step=-defaultStep; } clearTimeout(timer); obj.scrollTop+=step; timer=setTimeout(function(){ scrollDiv(id); },100) } function stopMe(){ clearTimeout(timer); } function scrollMe(id){ scrollDiv(id) } </script> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Aylonetic Sounds [v1.1] | News</title> <style type="text/css"> .center { margin:auto; width:1024px; } .center2 { width:1024px; height:450px; border:none; overflow:scroll; } #apDiv2 { position:relative; width:50px; height:30px; z-index:0; left: 611px; top: 0px; } body { background-color: #000; } </style> </head> <body onload="MM_preloadImages('titlehover.jpg','marketplacehover.jpg','forumshover.jpg','supporthover.jpg','abouthover.jpg','images/title_new_hover_inv.jpg','images/marketplace_new_hover_inv.jpg','images/forums_new5_hover_inv.jpg','images/support_new_hover_inv.jpg','images/about_new_hover_inv.jpg')"> <div class="center"> <table width="1025" border="0"> <tr> <td width="673"><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image7','','images/title_new_hover_inv.jpg',1)"><img src="images/title_new_main_inv.jpg" name="Image7" width="150" height="14" border="0" id="Image7" /></a></td> <td width="46"><img src="images/news_new_hover_inv.jpg" width="58" height="14" /></td> <td width="101"><a href="marketplace.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image8','','images/marketplace_new_hover_inv.jpg',1)"><img src="images/marketplace_new_main_inv.jpg" name="Image8" width="100" height="14" border="0" id="Image8" /></a></td> <td width="63"><a href="forums.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image9','','images/forums_new5_hover_inv.jpg',1)"><img src="images/forums_new5_main_inv.jpg" name="Image9" width="65" height="14" border="0" id="Image9" /></a></td> <td width="69"><a href="support.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image10','','images/support_new_hover_inv.jpg',1)"><img src="images/support_new_main_inv.jpg" name="Image10" width="70" height="14" border="0" id="Image10" /></a></td> <td width="47"><a href="about.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image11','','images/about_new_hover_inv.jpg',1)"><img src="images/about_new_main_inv.jpg" name="Image11" width="58" height="14" border="0" id="Image11" /></a></td> </tr> </table> <table width="1024" border="0"> <tr bgcolor="#FFFFFF"> <td width="507"><img src="images/banner1.jpg" width="507" height="150" border="0" /></td> <td width="507"><img src="images/banner2.jpg" width="507" height="150" /></td> </tr> </table> <body onload="scrollMe('news')"> <div class="center2" id="news"> <table width="1024" border="0"> <tr> <td width="507"><img src="images/newstemplate_l.jpg" width="506" height="100" /></td> <td width="507"><img src="newstemplate_r.jpg" width="506" height="100" /></td> </tr> <tr> <td><img src="images/newstemplate_l.jpg" alt="" width="506" height="100" /></td> <td><img src="newstemplate_r.jpg" alt="" width="506" height="100" /></td> </tr> <tr> <td><img src="images/newstemplate_l.jpg" alt="" width="506" height="100" /></td> <td><img src="newstemplate_r.jpg" alt="" width="506" height="100" /></td> </tr> <tr> <td><img src="images/newstemplate_l.jpg" alt="" width="506" height="100" /></td> <td><img src="newstemplate_r.jpg" alt="" width="506" height="100" /></td> </tr> <tr> <td><img src="images/newstemplate_l.jpg" alt="" width="506" height="100" /></td> <td><img src="newstemplate_r.jpg" alt="" width="506" height="100" /></td> </tr> <tr> <td><img src="images/newstemplate_l.jpg" alt="" width="506" height="100" /></td> <td><img src="newstemplate_r.jpg" alt="" width="506" height="100" /></td> </tr> <tr> <td><img src="images/newstemplate_l.jpg" alt="" width="506" height="100" /></td> <td><img src="newstemplate_r.jpg" alt="" width="506" height="100" /></td> </tr> </table> </div> </div> </body> </html> Hi Guys , This is the urgnt requirement , I want to change the Browsers setting languge through java script ,and according to it , The data wht I enter dhould be change .Thanks In advance Hi, I have an Issue with a Javascript slideshow. If you see link below it is obvious http://scriptdemo.co.uk/davidgray/al...tes/index.html please can you advise? I only get the Issue in Internet Explorer 8 many thanks Joe Take a look at this - http://s385506566.websitehome.co.uk/ If it is ran in either chrome or safari it acts as it should (the sub menus open below the nav bar) but in IE and Firefox it is very different and a problem (the sub menus open Above! the nav bar) Any Ideas? Hi everyone I know this has probably been asked a million times before but I have been searching the net for hours and have not found a solution so I am hoping one of you clever people will be able to help me. PLEASE!! I am using this snow fall script http://www.dynamicdrive.com/dynamicindex3/rain.htm It works perfectly in IE but not in Firefox or Safari. I'd like it to work in all or most browsers if thats possible. Unfortunately, I am still learning so don't understand all the technical speak as yet so if someone can help in simple terms I'd be ever so grateful Thank you so much to anyone who can help me out! Hello, I am developing a website using HTML, CSS and JavaScript. Actually, I used Javascript a lot in that website and I am developing it in Internet Explorer Environment but I want to display it on the Firefox or Google Chrome but the problem is some of javascript codes do not work in these browsers. So what Should I do? I think I need to define the javascript for the different browsers, so how can I do that? Hi, I have a JS that can run on IE but cannot on FireFox and Safari. The script like this: Code: function DeleteClick() { var frmSWO = document.getElementById("form"); var answer = confirm("Do you really want to delete?") if (answer != 0) { frmSWO.action = "/domsWeb/controller/manageWorkOrder/DeleteJobOrImage.do"; frmSWO.method = "post"; this.form.fireEvent('onsubmit'); frmSWO.submit(); } } So after I change the script, it now can work on Safari and Firefox but cannot on IE. The script is below: Code: function DeleteClick() { var frmSWO = document.getElementById("form"); var answer = confirm("Do you really want to delete?") if (answer != 0) { frmSWO.action = "/domsWeb/controller/manageWorkOrder/DeleteJobOrImage.do"; frmSWO.method = "post"; if(frmSWO.fireEvent) { frmSWO.fireEvent('onsubmit'); //'this.form' might be not clear enough } else { frmSWO.submit(); //fireEvent may not be neccessary since submit() is also called } } } This is really troublesome! Please help me to amend the script for it to be able to work on all 3 browsers. Appreciate any help. First off by let me stating that I am not a great web devloper nor am I a good with css / javascript. I am creating this website for a friend of mines company and I have one problem. The problem is that the navigation menu on the right side will not remain fixed how i want it to be. I spoke with many people and they all said that this cannot be done with css considering your layout and because it needs to dodge the headers and the footer. I basically want this div (sidenav on the right) to scroll along the page as users scroll up or down but it can not interfere with the header or footer. Could someone please post an example or if anyone has the time please tell me exactly what code I need to add to get this to work? keep in mind that i do not want the right side navigation to go over the content or out of the wrapper. I want it to stay in the same position in all aspects - left / right / top / bottom. Here is a link to the site http://www.collisionbodyworks.com/Pl...tic/index.html Any help would be greatly appreciated. Thank you in advance Hey, everyone: I've been having some trouble with javascript in different browsers. I developed my website using Safari and Chrome on a Mac, only to now realize that some of my javascript will NOT function in FireFox and IE (for both Mac and Windows). I understand that each browser has its quirks, but I'm not aware of anything that would cause my code to act so strangely. The biggest problem seems to be my onload() call in the body tag. I'm definitely an amateur, so forgive me if my work is not professional. Here's the JS in the head: Code: <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=8" /> <title>Wave Shark | Compose, Store, and Share Workouts</title> <script type="text/javascript">//<![CDATA[ function toggle(e) { if (e.style.display == "none") { e.style.display = ""; } else { e.style.display = "none"; } } //]]> </script> <script type="text/javascript">//<![CDATA[ var domainroot="#" function Gsitesearch(curobj) { curobj.q.value="site:"+domainroot+" "+curobj.qfront.value } //]]> </script> <link href="cssFiles/style.css" rel="stylesheet" type="text/css" media="screen" /> <link rel="shortcut icon" href="../cssFiles/images/img04.jpg" type="image/x-icon" /> <script src="incFunctions/functions.js" type="text/javascript"> </script> </head> And in the body tag: Code: <body oncontextmenu="return false;" onload="toggle(progress)"> <div id="progress" style="text-align:center;width:100%"><strong style="font-size:14pt;color:#0000DD;font-family:"arial,helvetica,sans-serif">Loading...</strong></div> In addition to that, you can check out: http://waveshark.elementfx.com/incFu...s/functions.js Any and all suggestions are appreciated. thanks for your time - I am more of a hacker than a coder. I have a webpage with a setinterval script I put together which reloads another page's php content into an iframe on the page. It works fine in IE, but doesnt work in FF or Chrome. (I dont want to use a refresh meta though that seems to work in IE & Chrome but not FF.) Here's the script snippet I wrote: Code: <script> window.setInterval("reloadIFrame();", 5000); function reloadIFrame() { document.frames["chat"].location.reload(); } </script> <iframe id="chat" src="../chat/buffer.php" width="100%" height="200"></iframe> on the page's first load, all the info is there in the iframe, but except for IE, updates do not show (the reloads dont seem to occur). I have a javascript that precedes this script containing a setTimeout, but never had issues with it. I can post the entire page code, if needed... thanks again. HWL |