JavaScript - Help With Displaying An Image In Html
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 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 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, I have an html script and a .php script. The .php requests a random word from a table of words in a mysql database. I wrote a html form to display the requested word in a text box. Here is my html file: Code: <html> <body> <script type="text/javascript"> function myfunction() { var xmlhttp; if(window.XMLHttpRequest) { xmlhttp= newHttpRequest(); } else { xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if(xmlhttp.readyState==4) { document.myLingo.word.value=xmlhttp.responseText; } } xmlhttp.open("GET", "get_Word.php",true); xmlhttp.send(null); } </script> <form name="myLingo"> <input type="button" name="button" value="New Word" onClick="myFunction();" /> <input type="text" name="word" /> </form> </body> </html> and here is my .php script: Code: <?php $con=mysql_connect('localhost', 'xxxx', 'xxxx'); if (!$con) { die('Could not connect: '.mysql_error()); } mysql_select_db("my_lingo", $con); $sql=mysql_query("SELECT `word` FROM `words` ORDER BY RAND()") or trigger_error('Error: ' .mysql_error()); $word=mysql_fetch_array($sql); echo $word[0]; mysql_close($con); ?> When I run this in Internet Explorer; I get a error that is asking for an object on line 32 which is the line that has my button in the javascript. When i run it in firefox, I don't receive an error, but the page still does nothing. Any suggestions? The main function of the page is that, when I click the button, it's supposed to return me a random word from the .php script Thanks, jcjst21 Hey the Title basically says I need a way to read the iframe url even when you navigate to a different page it will read again and keep tracking where the URL is on. Display the URL of the iFRame all the time how would I do this is it possible? Javascript HTML PHP Is used Hey, i am just trying to learn javascript and my friend gave me a little assignment to try and figure out. i am having trouble figuring it out and need some help. basically i just want to display the information in my associative array, into an html table. var NFC_east = new Array(); NFC_east[0]=["Giants", 16, 0, "Eli Manning"]; NFC_east[1]=["Cowboys", 0, 16, "Tony Romo"]; NFC_east[2]=["Redskins", 0, 16, "Donnovan McNabb"]; NFC_east[3]=["Eagles", 0, 16, "Mike Vick"]; that's my array. now i need to display that in a table with a Team column, wins column, loses column, and a quarterback column. i basically want to do this using a for loop, and he gave me a hint about using a nested while loop as well somehow. i know i need to use getElementById, id, and innerHTML stuff but i just don't know how to do it. i cant find anything to help me with this simple task, hoping someone here could help. Basically what I need to do is cause a bit of HTML to only display on a specific page. I have figured out how to do most of the work i.e. figuring out what page that the code is being displayed on, etc. However, for some reason the DOM element that I am using will not update based on the Javascript. I have searched the Internet for a solution and unfortunately I have found none. Here is the version of the code that I am currently working on: Code: <html> <head> <script type="text/javascript"> window.onload = function DisplayButton() { var DesiredPage = 'Page to Display'; //Page that I want the code to display on var sPath = window.location.pathname; var sPage = sPath.substring(sPath.lastIndexOf('/') + 1); //This determines and places in a variable what page that the code will be on if (sPage == DesiredPage) { document.getElementById('HiddenCode').style.display = "block"; } } </script> <p Id="HiddenCode" style="display:none">Code only to be displayed on indicated page</p> </head> </html> I am somewhat new to Javascript so I feel like I might be missing something obvious here. Thank You to anyone who can help. Zbot 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. /** The <a> is a list of menu items that when clicked.... a specific gallery-slider-images should been shown in relation to the galleryId....<div class"gallery" is hidden in CSS> I'd like to use jQuery to complete this task if at all possible, I know it's prob SIMPLE to U GURU's but being new i can't seem to .show() the selected 'gallery' w/o showing them all........... BEST REGARDS _ STH <div id="gallery-menu"> <?php foreach ($galleries as $gallery) : ?> <a onclick="showGallery(<?= $gallery['gallery']['id'] ?>); return false;"><?= $gallery['gallery']['name'] ?> <?php endforeach ?> </div> <?php foreach ($galleries as $gallery): ?> <div id="<?= $gallery['gallery']['id'] ?>" class="gallery"> <div class="slider" style="width; 100%; height: 100%;"> <ul> <?php foreach ($gallery['images'] as $image): ?> <li class="galleries-container"> <img src="<?= UCMVC_APP_BASE_URL ?>/gallery/retrieve-image/<?= $image['id'] ?>" alt="<?= $image['name'] ?>" title="<?= $image['name'] ?>" /> </li> <?php endforeach; ?> </ul> </div> </div> <?php endforeach; ?> // javascript // function showGallery(galleryId) { ????!?!?!?!?! } 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> Hi, Firstly, I would like to introduce myself. I am new to the application framework in sencha and JS. Acutally i have to pop an image on click of the text. I checked some of the same codes and wrote this code in sencha javascript. can any one please check what's wrong with this code and let me know how to call this function from html code. function showEditWindow() { var win = new Ext.Window({ title: 'image', width: 100, height: 100, html: '<img src=\"p1.png\"></img>', }); win.show(); return win; }; Hi. I am new here. I wanted help for a JavaScript code. You might think I'm lazy for not writing it myself, but the truth is I am not a JavaScript coder. I just have a really simple website and I am trying to do something for which I know JS is required but I don't know how to do it. I've also searched around but couldn't find the appropriate code. What I want to do is to make an html page load a different background image every time it refreshes. I will have a list of background images and I want to be able to add in this list, without having to change anything else in the codes after I do this (I think this is made by making an array of images and by putting .length somewhere in the codes, but I don't know exactly how I should do this). I already know how to do an external file (.js) and link to it from my .html page. Now I want the code to put in the .js file, and the code to put in the <body> of my .html file. Please help me Thanks this page will display new images when you mouseover the red and orange arrows on the menu on the right side in chrome, but not ff, ie, opera, and safari. Any ideas as to why these other browsers aren't running the code like chrome? guessing this is javascript related - anyone want to offer any clues?
favorite I'd like to modify a form on www.formsite.com (form builder app): username: testuser password: password I would like to use the nicedit.com's inline content editor's js to transform my textarea's into a richtext area. At present the nicedit editor works well in creating the richtextarea. However, the KEY point is that I would like formsite's form to pipe in the the created html and render it with the html component of formsite. Currently, the pipe function in formsite will only put out the html syntax in it's html module. action seen he http://fs8.formsite.com/testform/form1/index.html So this would be: 1. checking out my form on formsite.com 2. the script from nicedit.com is already installed in an html component. 3. changing or telling me the scripts/tags/or whatever for formsite form using formsites form builder (which allows some html/script editing). 4. changed so as to render the rich text entered on page 1 in page 2 instead of the html syntax. Any other solutions using formsite and any other richtextarea solutions would be great too! i have image button i need to display image .if the size of the image button is 100*100 and image size is 50*50 .the remaining space of the image button should be empty.the image should not stretch. can any one guide me i am new to programming Thanks in advance!!! Hello, for some reason this code isnt showing anything: Code: <span id = "message" style="color:black; font-size:12pt; font-family:arial,verdana,sans-serif"></span> <script type = "text/javascript"> var targetURL="#"; var countdownfrom = 10; var currentsecond = countdownfrom +1; function countredirect() { if (currentsecond !=1 ){ currentsecond -=1; var mess = "You will be redirected to Points2shop in " + currentsecond + " seconds."; document.getElementById("message").innerHTML = mess; } else{ window.location=targetURL; } setTimeout("countredirect()",1000); } countredirect(); </script> ive tried: Code: <form name="message"> <span id = "message" style="color:black; font-size:12pt; font-family:arial,verdana,sans-serif"></span> </form> <script type = "text/javascript"> var targetURL="#"; var countdownfrom = 10; var currentsecond = countdownfrom +1; function countredirect() { if (currentsecond !=1 ){ currentsecond -=1; var mess = "You will be redirected to Points2shop in " + currentsecond + " seconds."; document.getElementById("message").innerHTML = mess; } else{ window.location=targetURL; } setTimeout("countredirect()",1000); } countredirect(); </script> Anyone know why? Thanks I thought I knew how, but I'm unclear how to get this function to display: "document.getElementById("txtHint").innerHTML=xmlhttp.responseText;" inside the div. Will you show me please? Code: xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { var div = document.createElement('div'); div.setAttribute('id', 'txtHint'); div.setAttribute("style","background-color:red;"); div.style.width = '300px'; div.style.height = '100px'; document.getElementById("txtHint").innerHTML=xmlhttp.responseText; //var txt='hello world!'; document.getElementsByTagName('body')[0].appendChild(div); document.getElementById('textHint').innerHTML=txt; } } |