JavaScript - Help With Displaying An Image Using Javascript Via Xml
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 Similar TutorialsI 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! Hi, 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 Im coding a chat system, but the main thing which I cannot get working which is stopping me from doing this is displaying the data from the database. I have made a test XML document for the time being so that I can get the JavaScript/AJAX working properly, then I will figure out why my PHP isnt generating the XML file properly. Here is my XML document: Code: <?xml version="1.0" ?> <root> <message id="0"> <sender>martynball</sender> <receiver>someoneelse</receiver> <time>154375342</time> <text>Testing an XML document and seeing if the JavaScript will display it properly. If so then there is a problem with the PHP.</text> </message> </root> And here is my JavaScript/AJAX, for some reason there is NOTHING being displayed in the div which has the correct ID. Code: <script type="text/javascript"> function getXmlHttpRequestObject() { if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari return new XMLHttpRequest(); } if (window.ActiveXObject) { // code for IE6, IE5 return new ActiveXObject("Microsoft.XMLHTTP"); } return null; } //Make variables for later use var lastMess = 0; var sendReq = getXmlHttpRequestObject(); var receiveReq = getXmlHttpRequestObject(); var mTimer; function getMessage() { if (receiveReq.readyState == 4 || receiveReq.readyState == 0) { //var url = "scripts/get_data.php?uid=<?=$_SESSION['uid']?>&m=" + lastMess + "&chat=1"; var url = "testXMLdoc.xml"; receiveReq.open("GET", url, true); receiveReq.onreadystatechange = manageMessage; receiveReq.send(null); lastMess++; } } function manageMessage() { if (receiveReq.readyState == 4) { var xmldoc = receiveReq.responseText; var chat_div = document.getElementById('chat'); var msg_nodes = xmldoc.getElementByTagName("message"); var n_msg = message_nodes.length; for (i = 0; i < n_msg; i++) { var sender_node = msg_node[i].getElementByTagName["sender"]; var receiver_node = msg_node[i].getElementByTagName["receiver"]; var time_node = msg_node[i].getElementByTagName["time"]; var text_node = msg_node[i].getElementByTagName["text"]; chat_div.innerHTML = "He <br />" + sender_node[0].firstChild.nodeValue + "<br />"; chat_div.innerHTML = reciever_node[0].firstChild.nodeValue + "<br />"; chat_div.innerHTML =time_node[0].firstChild.nodeValue + "<br />"; chat_div.innerHTML = text_node[0].firstChild.nodeValue + "<br />"; } } } </script> Also, I put a alert under the manageMessage() function before the IF statement and that gets displayed. I have to display a div before firing a sync ajax in javascript div is getting displayed in firefox but not in IE and chrome. I need to basically display a download bar to indicate the user that the request is in progress I am one problem. When i click a link a some information in html is to be displayed on the screen. I have written code for that. But before i click the link i am able to display the content. Please look into my code and give some suggestions: <html> <head> </head> <body> <center> <table> <tr> <td> <a href="javascript:Chg1()">Add Required (Features)</a> </td> <td> <a href="javascript:chg2()">Add via Search</a> </td> <td> <a href="javascript:Chg3()">Add via List</a> </td> </tr> </table> </center> function chg2() { document.write(<b> Type Model Feature Relationship Search and Add </b>);s <table> <tr> <td> Type<input type="text" id="type" name="type" value=""> </td> <td> Document Number<input type="text" id="doc" name="doc" value=""> </td> </tr> <tr> <td> Model<input type="text" id="model" name="model" value=""> </td> <td> Promoted<input type="text" id="promoted" name="promoted" value=""> </td> </tr> <tr> <td> Feature<input type="text" id="feature" name="feature" value=""> </td> </tr> </table> } </script> </body> using a javascript function to determine if a string is all digits or not and return result based off the decision. if it is all digits, mask all digits except the first two, if not all digits just return the string. these are the snippets however i am not seeing anything returned in the column Code: <script > var start = function RenderRC(CodeOwner) { var Rcode = CodeOwner.toString(); var pattern = new RegExp("^\d{2,}$ "); if (Rcode.match(pattern)) { if (Rcode.length > 2) { var newcode = Rcode.substr(0, 2) + Array(Rcode.length - 2 + 1).join("*"); return newcode; } } else { return Rcode; } }; </script> <ext:RecordField Name="CodeOwner" /> <ext:Column Header="<%$ Resources:Text, CodeOwner %>"DataIndex="CodeOwner" Width="110" > <Renderer Fn ="start" /> </ext:Column> I'm very new at JavaScript and I'm trying to get each of the if statements below in a text text box with the result depending on the answer of the equation. However i can't figure out a way to allow the user to click a button to to show the result in a text box. If anyone could help it would be much appreciated. Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <script type="text/javascript"> function calculate() { A = document.form1.text2.value B =(parseInt(A ) * 52) D= (parseInt(B ) * 0.015 ) if ( B <= 6000){ tax = 0;} else if (B <= 37001){ tax = (B - 6000) * .15; } else if (B<= 80001){ tax = (B - 37000) * .30 + (37000 - 6000) * .15; } else if (B <= 180001){ tax = (B- 80000) * .37 + (80000- 37000) * .30 + (37000 - 6000) * .15; } else tax = (B - 180000)* .45 + (180000 - 80000 begin_of_the_skype_highlighting**************180000 - 80000******end_of_the_skype_highlighting) * .37 + (80000- 37000) * .30 + (37000 - 6000) * .15;} </script> </HEAD> <BODY> <form name="form1"> Weekly Salary: <INPUT TYPE="TEXT" NAME="text2"> <INPUT TYPE="BUTTON" VALUE="SUBMIT" Onclick="calculate();"> </BODY> </HTML> I am currently using the JavaScript Light Box found on; http://www.huddletogether.com/projects/lightbox2/ I was wondering if it is possible, or easy enough to create something alike the one found on; http://www.whsmith.co.uk/Support/Hel...ffiliates.aspx when you click on; > How to become an affiliate > Complete the OMGuk.com affiliate application form. Many Thanks, Tim Howdy all. I have Win 7, IE9. I have a HTML file on my hard drive, with Javascript within. When I load the page, it keeps popping up Do u want to allow this content, I have to click to allow. I want to stop this, and after doing some searching I found the setting in Internet Options, Advanced - "Allow active content to run in files on my computer". Perfect. Doesnt work. When i check this box, the page loads without the warning, but then the Javascript just doesnt work. Getting quite annoying, because this file is my home page. Any help would be great! I'm working with greasymonkey scripts. Firefox JS console would always display GM script errors, but all of the sudden it stopped doing that. Script just won't load and no errors are displayed. I didn't touch any settings, yesterday they were showing fine, today none are displayed. Would appreciate any help.
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 Hi all, I want to display varying company information from a javascript array randomly each time the page is refreshed. My problem is that the each piece of company information must be split up into 3-4 array elements since I have set up spans in the body where the information go accordingly and as such I don't how to randomize that. The relevant code is (I will only give two company examples as it's a long list): Code: <script type="text/javascript" language='javascript'> function compInfo(comp){ var companyInfo = new Array(); if(comp == document.getElementById('test').innerHTML) { //insert business name here. companyInfo[0] = 'Test'; //insert business type here. companyInfo[1] = 'Media'; //insert street name here. companyInfo[2] = 'Test Road.'; //insert actual opening time here. companyInfo[3] = '5am - 10pm'; //insert actual closing time here. companyInfo[4] = 'Christmas'; //insert contact info here. companyInfo[5] = 'test'; //insert web address here. companyInfo[6] = '<a href="http://www.test.com" style="color: #0092DD; text-decoration: none;">test.com</a>'; //insert image link here. companyInfo[7] = 'images/test.jpg'; } if(comp == document.getElementById('test1').innerHTML) { //insert business name here. companyInfo [0] = 'Test1'; //insert business type here. companyInfo [1] = 'Club'; //insert street name here. companyInfo[2] = 'Test1 Road.'; //insert actual opening time here. companyInfo[3] = '5am - 10pm'; //insert actual closing time here. companyInfo[4] = 'Christmas'; //insert contact info here. companyInfo[5] = 'test1'; //insert web address here. companyInfo[6] = '<a href="http://www.test1.com" style="color: #0092DD; text-decoration: none;">test1.com</a>'; //insert image link here. companyInfo[7] = 'images/test1.jpg'; } document.getElementById('title').innerHTML =companyInfo[0]; document.getElementById('name').innerHTML = companyInfo[1]; document.getElementById('street').innerHTML = companyInfo[2]; document.getElementById('open').innerHTML = 'Open'; document.getElementById('otime').innerHTML = companyInfo[3]; document.getElementById('close').innerHTML = 'Closed' document.getElementById('ctime').innerHTML = companyInfo[4]; document.getElementById('contact').innerHTML = 'Contact'; document.getElementById('cinfo').innerHTML = companyInfo[5]; document.getElementById('web').innerHTML = companyInfo[6]; document.getElementById('image').style.display = 'block'; document.getElementById('image').src = companyInfo[7]; } </script> </head> <body> <SPAN ID='test' onclick="compInfo(document.getElementById('test').innerHTML);"><b>Test</b></SPAN> <SPAN ID='test1' onclick="compInfo(document.getElementById('test1').innerHTML);"><b>Test1</b></SPAN> //info shown he <div style='text-overflow: ellipsis;'> <table cellpadding='0' cellspacing='0' border='0' style='height:178px; width:185px;'> <tr> <td align="left" style='height:25px;'> <b><SPAN ID='title' ></SPAN></b> </td> </tr> <tr> <td align="left" > <SPAN ID='name' ></SPAN> <br /> <SPAN ID='street'></SPAN> <div style='height:8px;'> </div> <SPAN ID='open'></SPAN> <br /> <SPAN ID='otime'></SPAN> <br /> <SPAN ID='close'></SPAN> <br /> <SPAN ID='ctime'></SPAN> <br /> <div style='height:8px;'> </div> <SPAN ID='contact'></SPAN> <br /> <SPAN ID='cinfo'></SPAN> <SPAN ID='web'></SPAN> <img ID='image' style='display:none;'></img> </td> </tr> </table> </div> </body> So essentially the process is: 1. The person clicks on the company name. 2. Relevant information from the array is shown in the div. But what I want is that on startup, information about a random company is shown automatically. How can I achieve this? Thanks. Box 1 - Box 2 / Box 3 and i put a round off number so the decimals dont give a million numbers the problem is...the math is wrong now.... someone please help me fix this.. <!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>Calc</title> <script type="text/javascript"> function calculate() { var one = document.getElementById("one").value*1; var two = document.getElementById("two").value*1; var three = document.getElementById("three").value*1; document.getElementById("answer").value=((one-two)/three); ; } </script> </head> <body> Enter Number 1 <br> <br><input type="text" id="one" /><hr>Enter Number 2<br><br><input type="text" id="two" /><br><br><hr>Enter Average number<br><br><input type="text" id="three" /><br><br><button onclick="calculate();">Calculate</button> <br id="result"></center></br> Total <input type="text" readonly="readonly" id="answer" /><br><br></center> </body> </html> </td> </tr> </table> </center> </body> </html> 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. Hi, I'm using javascript in addition to a web service (BTBuckets) to display different content to visitors based on actions they take on my site. The javascript is working fine, but I noticed that if I simulate BTBuckets being disabled using Firefox Adblock none of the content shows up. So in the off chance of the service going offline it'll leave some pretty funky holes in the my content. I tried <noscript> tags which works with javascript off, but the content is still blank when I disable BTBuckets. I'm wondering if there's a way to display the default content if the service is unavailable? Here's the code I'm using: In the head: Code: <script type="text/javascript"> //<![CDATA[[ $BTB={s:XXXXX}; $BTB.jsh="http://static.btbuckets.com/bt.js"; //]]> </script> <script type="text/javascript"> document.write(unescape("%3Cscript src='" + $BTB.jsh.replace(/(https?:)/i,document.location.protocol) + "' type='text/javascript'%3E%3C/script%3E")); </script> The code in the body used to replace an image depending on visitor behavior: Code: <script type="text/javascript"> var _t = ""; if ($BTB.clusters["ppc_visitors"]) { _t = "\"images/top-photo-tracking-number.jpg\" alt=\"Call Toll-Free: 1-800-XXX-XXXX\">"; } else { _t = "\"images/top-photo.jpg\" alt=\"Call Toll-Free: 1-800-XXX-XXXX\">"; } document.write('<img src= ' + _t ); </script> <noscript><img src="images/top-photo.jpg" alt="Call Toll-Free: 1-800-XXX-XXXX"></noscript> I typed this code straight out of the book and it just doesn't seem to work. I have the headlines on the left side and when clicked the contents of the headline is supposed to show up in the text box on the right. Well, needless to say, nothing appears. Please someone tell me what I am doing wrong. I am not the only person in the class having this issue. Thanks a million. Code: <!DOCTYPE HTML> <!--mwelborn--> <!--Chapter 8 Page 475--> <!--October 25, 2011 --> <html> <head> <title>News Items</title> <script type="text/javascript"> /* <![CDATA[ */ var newsItem1 = "L'AQUILA, ITALY (AP) - L'Aquila's chief prosecutor announced an investigation into allegations of shoddy construction as people sill missing after a devastating earthquake five days ago. http://in.reuters. com/article/ idUSWBT01103020090411; var newsItem2 = "WASHINGTON (Reuters) - President Barack Obama said on Friday the recession- hit US economy was showing 'glimmers of hope' despite remaining under strain and promised further steps in coming weeks to tackle the financial crisis. http://in.reuters.com/article. idUSWBT01103020090411"; var newsItem3 = "(eweek.com) - Apple is close to hitting 1 billion downloads from its App Store and plans on a prize giveaway fo whoever downloads the billionth application that includes a MacBook Pro and an iPod Touch. http://www.eweek.com/c/a/ Application-Development/eWeek-Newsbreak -April-13-2009/"; var newsItem4 = "ATLANTA (AP) - Chipper Jones drove in two runs, including a tiebreaking single, and the Atlanta Braves beat Washington 8-5 on Sunday to hand the Nationals their sixth straight loss to start the season. http://www.newsvine.com/_news/2009/04/11 2667835-jones-braves-beat-winless -nationals-8-5?category=sports"; /* ]] */ </script> </head> <body> <form name="newsHeadlines" action="" method="get"> <table style="border: 0; width: 100%"> <tr valign="top"> <td> <select name="newsHeadlines" multiple="multiple" style="height: 93px"> <option onclick="document.newsHeadlines .news.value=newsItem1"> Investigation of building standards in quake zone</option> <option onclick="document.newsHeadlines .news.value=newsItem2"> Obama sees signs of economic progress</option> <option onclick="document.newsHeadlines .news.value=newsItem3"> Apple App Downloads Approach 1 Billion</option> <option onclick="document.newsHeadlines .news.value=newsItem4"> Jones, Baves beat winless Nationals 8-5</option> </select> </td> <td> <textarea name="newsHeadlines" cols="50" rows="10" style="background-color: Transparent"></textarea> </td> </tr> </table> </form> </body> </html> Hello, I am working on a page that has a jQuery full browser BG image and I am trying to also utilize a MooTools gallery. There seems to be some interference between the two JavaScripts as only one works (whichever one is last in order in the header of the HTML document). Links: http://www.courtneyhunt.com.au/press_bg.html http://www.courtneyhunt.com.au/press_gallery.html I am a complete novice with JavaScript so if anyone could help that would be great. Thank you in advance. 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> |