JavaScript - Javascript Image Moving Around In Firefox??
Hello all!
I am fairly experienced in HTML but javascript I am useless with. My website can be found here; http://mgwalker.site90.com/index.html If you would be as kind as to load it in Chrome and in firefox, in firefox the changing image pops up on the top right of the screen. In Chrome it is centered in the div, as it should be... Please help I have no idea why this would happen! Similar TutorialsHi, I'm noob , but i have nice idea i want to do it but i can't .. i tried many ways to do it .. but didn't work any of them .. the idea is move the foot to room no.1 .. but i want to see the foot moving on the red line to the room like this pic : Hi there folks. I am a bit stuck with a little code. I am making a online yearbook entry and I wanted an image of myself animate/move from the top left hand to the bottom right of the screen. I also wanted to allow people reading it the option to change bg colour and text size - but I have managed to do those. The difficulty I am having is with moving the image, could anybody suggest any simple codes because I am new to this and don't want my head spinning before I go any further! Any help is greatly appreciated. Hello, I'm newbie in javascript, but i want to make an moving image. In time it should change to other image with other button. Also it could be changed by user. The change should be dynamic like moving from left to right. ^^ Any advices, tutorial links or smthing.. Thx Hello everyone. I am trying to make a flag with css and then move it with javascript. Code: <html> <head> <title>Flag</title> <link rel="stylesheet" type="text/css" href="flag3.css" /> <script language="javascript"> Hmove=-100; function moveObjRight(obj) { obj.style.left=Hmove; Hmove+=4; if(Hmove<900) window.setTimeout("moveObjRight(" +obj.id+ ");", 0); } </script> </head> <body> <h1>The flag of ___ by www</h1> <div id="bar3"> <div id="bar2"> <div id="bar1"> </div> <br /> <br /> <br /> <br /> </div> <br /> <br /> <br /> <br /> </div> <script language="JavaScript"> moveObjRight(bar3); </script> </body> </html> This is my code. The image is moving to the right, but i want it bounce from side-to-side in the browser window. Any help will be appreciated. Thank you. Hey guys, I was trying to make a Javascript game that moves an image across the screen randomly. Instead of executing properly, it just shows the image's starting point, and stops. No movement. Is there anyway I could fix this? Thanks, Fizz. Code: <html> <head> <title>Image Mover</title> <style> DIV.movable { position:absolute; } </style> </head> <script language="javascript"> function Start() { var x = 5; //Starting Location - left var y = 5; //Starting Location - top var dest_x = Math.floor(Math.random()*650); //Ending Location - left var dest_y = 500; //Ending Location - top var interval = 10; //Move 10px every initialization moveImage(); } function NewDest() { var x = 5; //Starting Location - left var y = 5; //Starting Location - top var dest_x = Math.floor(Math.random()*650); //Ending Location - left var dest_y = 500; //Ending Location - top var interval = 10; //Move 10px every initialization moveImage(); } function moveImage() { //Keep on moving the image till the target is achieved if(x < dest_x) x = x + interval; if(y < dest_y) y = y + interval; //Move the image to the new location document.getElementById("ufo").style.top = y+'px'; document.getElementById("ufo").style.left = x+'px'; if ((x+interval < dest_x) && (y+interval < dest_y)) { //Keep on calling this function every 100 microsecond // till the target location is reached window.setTimeout('moveImage()',30); if (x == dest_x) && (y == dest_y) { NewDest(); } } } </script> <body onload="Start()"> <div id="ufo" class="movable"> <img src="Mouse.jpg" alt="mouse" WIDTH = 30/> </div> </body> </html> Hello, I am trying to move an image down 20px each time the button is clicked, but I can only get it to move down once. I see what I am doing wrong, but I'm not sure how to fix it. I don't know how to store the updated position of the image in a variable. Code: <center> <input type="button" value="Click" onClick="moveDown()"/> </center> <img id="Ball" src="ball.jpg" style="position:absolute; top:100; left:100;"/> <script language="JavaScript"> var Image = document.getElementById("Ball"); var Position = 100; function moveDown() { Image.style.top = Position + 20 } </script> Thanks, Celia My code is: Code: <html> <head> <script type='text/javascript'> winx=220 winy=176 self.resizeTo(winx,winy); </script> <img id="default" style="z-index: 0;left: 0; position: absolute; top: 0px" height=32 width=32 align=baseline border=0 hspace=0 src='save.gif'></p> <script type="text/javascript"> document.getElementById("default".style.top = '0px'; document.getElementById("default".style.left = '0px'; </script> The image shows up, but it doesn't move. I can't seem to find out what I'm doing wrong. Edit: Finally spotted it, I was missing a ")" ._. Hello. I am getting to learn JavaScript, and as for my first personal project, I would like to have a page with some text on it and when the user scrolls, a div containing a picture will move with the user when they scroll. I have found a solution, however, I do not like it. Code: <html> <head runat="server"> <title>Test</title> <link type="text/css" href="Main.css" rel="Stylesheet" /> </head> <body class="mainbackground"> <div id="group"> <div id="sizer" class="sizeholder"></div> <div id="image" class="image"></div> </div> <form id="form1" runat="server"> <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 /><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> </form> <script type="text/javascript" > window.onload = function () { onscroll = function () { var scrollevel = document.body.scrollTop; if (scrollevel == 0) { if (window.pageYOffset) scrollevel = window.pageYOffset; else scrollevel = (document.body.parentElement) ? document.body.parentElement.scrollTop : 0; } scrollevel = scrollevel + 250; document.getElementById("sizer").style.height = scrollevel + 'px'; } } </script> </body> </html> As you can see, it works by getting the scroll position and adding 250, to a height property-element above the image div. I have tried to use document.getElementById("image").style.top = scrollevel + 'px', but it does not work. Any ideas??? hi all, I want to be able to move an image from a left or right when tilting my ipad. when tilted the the right the image moves to the right according to the angel tilted and do the same to the other direction. the image is doubled (or more) the size of the stage (1024x768). I can't use Flash for obvious reasons so looking at other options. thanks I've put together a couple of scripts, in order that I can make an image move left or right on the x-axis, depending on the LR (left/right) read-out from the accelerometer of an iPhone. However, it's not working at the moment, so could anyone possibly see what I've missed out - I've worked on it that long, that I think I'm missing something obvious!! THANKS!! Code: <!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>onlywebpro.com</title> </head> <body> <h2>Device Orientation with HTML5 | onlywebpro.com</h2> <img src="Car4.png" id="car" style="position:relative;top:200px;left:200px; "><br> <script type="text/javascript"> if (window.DeviceOrientationEvent) { console.log("DeviceOrientation is supported"); window.addEventListener('deviceorientation', function(eventData) { var LR = eventData.gamma; deviceOrientationHandler(LR); var userWidth = window.screen.width; function moveRight() { var pp = document.getElementById("car"); var lft = parseInt(pp.style.left); var tim = setTimeout("moveRight()",50); // 50 controls the speed lft = lft+LR; // move by 50 pixels pp.style.left = lft+"px"; if (lft > userWidth + 439) { // left edge of image past the right edge of screen pp.style.left = -400; // back to the left clearTimeout(tim); } } }, false); } else { alert("Not supported on your device or browser. Sorry."); } var userWidth = window.screen.width; function moveRight() { var pp = document.getElementById("car"); var lft = parseInt(pp.style.left); var tim = setTimeout("moveRight()",50); // 50 controls the speed lft = lft+LR; // move by 50 pixels pp.style.left = lft+"px"; if (lft > userWidth + 439) { // left edge of image past the right edge of screen pp.style.left = -878; // back to the left clearTimeout(tim); } } </script> </body> </html> Hello everyone. I want to move my image through table cells by using arrow buttons. Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Move</title> <style type="text/css" > table { background-color:#FFCC00; margin-top: 100px; margin-bottom: 100px; } </style> </head> <body onload="setup()"> <script type="text/JavaScript" onkeydown="handleKey(event)"> document.write('<table border="1" cellspacing="0" cellpadding="10">'); var count =0 for (var row=0; row<20; row++) { document.write('<tr>'); for (var col=0; col<20; col++) { idnmr = count count++ document.write('<td style="border:0"; id="idnmr";>'); document.write('</td>'); } document.write('</tr>'); } function setup() { row=0; col=0; insertKnight(row,col); } function handleKey(e) { if (typeof e !='object') e=window.event; if (e.type == 'keydown' && (e.keyCode ==27 || (e.keyCode >= 37 && e.keyCode <=40))) { switch (e.keycode) { case 37: dC= -1; dR = 0; break; case 38: dC= +1; dR=0; break; case 39: dC = 0; dR = +1; break; case 40: dC= 0; dR=-1; break; } emptyCell(row,col); function emptyCell(row,col) { var id = 'r' + row + 'c' + col; var cell= document.getElementById(id); if(cell) cell,innerHTML=''; } row +=dR; col +=dC; //insert image insertKnight(row,col); return false; function insertKnight(row,col) { var id = 'r' + row + 'c' + col; var cell = document.getElementById(id); var colour = cell.className; if (colour != 'white') { var knight='cherry.png'; } else { var knight= 'cherry.png'; function eraseImage(row,col) { var id = 'r' + row + 'c' + col; document.getElementById(id).innerHTML = ''; } cell.innerHTML = '<img src=" ' + knight + ' " alt="' + colour + 'knight" />'; } document.getElementById('debug').innerHTML = 'r='+row+' c='+col; function drawImage(row,col) { var id = 'r' + row + 'c' + col; document.getElementById(id).innerHTML = '<img src="cherry.png"/>'; } </script> </body> </html> This is my code. Now i have problems with the eraseImage and drawImage functions. They just don't work. Any help will be appreciated. Thank you Code: function move_user_img(str) { var step = 25; // change this to different step value switch(str) { case "down": var x = document.getElementById('imageUser').offsetTop; x = x + step; document.getElementById('imageUser').style.top = x + "px"; break; case "up": var x = document.getElementById('imageUser').offsetTop; x = x - step; document.getElementById('imageUser').style.top = x + "px"; break; case "left": var y = document.getElementById('imageUser').offsetLeft; y = y - step; document.getElementById('imageUser').style.left = y + "px"; break; case "right": var y = document.getElementById('imageUser').offsetLeft; y = y + step; document.getElementById('imageUser').style.left = y + "px"; break; } } function move_report_img(str) { var step = 25; // change this to different step value switch(str) { case "down": var x = document.getElementById('imageReport').offsetTop; x = x + step; document.getElementById('imageReport').style.top = x + "px"; break; case "up": var x = document.getElementById('imageReport').offsetTop; x = x - step; document.getElementById('imageReport').style.top = x + "px"; break; case "left": var y = document.getElementById('imageReport').offsetLeft; y = y - step; document.getElementById('imageReport').style.left = y + "px"; break; case "right": var y = document.getElementById('imageReport').offsetLeft; y = y + step; document.getElementById('imageReport').style.left = y + "px"; break; } } Code: <div id ="display" style="width:640px; height:480px; overflow:hidden;"> <div> <img src =" <?php echo UPLOADPATH . $userImage; ?> " style = "position:absolute;" id="imageUser"/> </div> <div id ="imageReport"> <img src = " <?php echo $reportImage; ?> " style = "opacity:0.25;height:700px; width:450px;" /> </div> </div> <div style="position:absolute; top:550px; left:100px;"> <p>Control User Image</p> <input type=button onClick=move_user_img('up') value='Up'> <input type=button onClick=move_user_img('left') value='Left'> <input type=button onClick=move_user_img('right') value='right'> <input type=button onClick=move_user_img('down') value='down'> </div> <div style="position:absolute; top:650px; left:100px;"> <p>Control Report Image</p> <input type=button onClick=move_report_img('up') value='Up'> <input type=button onClick=move_report_img('left') value='Left'> <input type=button onClick=move_report_img('right') value='right'> <input type=button onClick=move_report_img('down') value='down'> </div> I have a website at: http://www.zionism101.org/defaultfornow.aspx The page works on Google Chrome, Mozilla Firefox, and IE-9. It sort-of works on IE-8, however, the problem is that on IE-8, there is about 2 seconds where everything is shown on top of everything else in a mess. This is bad. The website is unusual in that it uses a menu to slide screens from right to left. This has implications. For instance, I need the menu to appear on all screens, so I use absolute positioning, and then use javascript to calculate the center position. The same goes for a logo image. And on top of that, some screens (which are really DIVs) have items positioned by absolute and relative positioning within them, and those positions are often calculated via javascript (and then set). On IE-8, the result is not good. I think what is happening is that the browser first shows everything as it appears before javascript is run, and then slowly the javascript is run, which puts everything in the correct position. So initially, not only is everything in the wrong position, but different DIVs appear on top of each other. I could tell every user to get IE-9 or chrome, but thats not a good solution. Thanks, Gid P.S. one solution might be to make the screen go black for an instant, until everything has settled down. If thats the only solution, how would I do that? P.P.S. there are actually 3 pages in the site: the login page, the logout page, and the founders page. Everytime the user switches between them, the jumble for 2 seconds occurs. I came across your forums here and it looked like a great place to get some help, and help is exactly what I need! I have been struggling with this javascript that changes an image and its corresponding useMap. For reference: - All images are the same size and located in the same directory, except the main map image - All images are preloaded (I did this just in case it was an image problem) - The page works fine in Firefox, and fine in IE until it crashes - http://www.forthecode.com/imagemap/untitled.htm The Problem: - When clicking on a state in the main image, the state image appears, if you then click on the "return to the overview" it returns to the overview image then promptly crashes IE within 1-2 seconds. - This even happens in a completely blank page (no other content) Exceptions: - Clicking on the state Mississippi does not cause this problem (you can go back and forth with Mississippi without problem) - Tennessee, Ohio, Arkansas, Illonois crash as soon as their state map comes up! The Javascript function itself: Code: <script language="Javascript"> function changemap(vari){ var vari; var stoptime; if(vari=="regionview"){ document.regionmap.src = "/images/branchmap2.jpg"; stoptime = setTimeout( function changemap1(){ document.regionmap.useMap="#Map"; clearTimeout(stoptime);} , 300); } else{ document.regionmap.src = "/images/states/" + vari + ".jpg"; stoptime = setTimeout( function changemap2(){ document.regionmap.useMap="#"+vari; clearTimeout(stoptime);} , 300); } } </script> The image tag and image maps: Code: <img src="images/branchmap2.jpg" name="regionmap" usemap="#Map" border="0"> <map name="Map"> <area shape="rect" coords="144,14,189,91" href="#" onClick="javascript: changemap('indiana');" alt="Indiana" title="Indiana"> <area shape="poly" coords="139,91,137,104,132,108,132,115,128,118,160,110,167,109,189,91" href="#" onClick="javascript: changemap('indiana');" alt="Indiana" title="Indiana"> <area shape="poly" coords="230,138,123,139,121,131,127,122,140,117,153,115,170,107,191,90,194,85,202,87,213,90,221,91,225,90,232,92,232,100,238,107,242,114,245,119" href="#" onClick="javascript: changemap('kentucky');" alt="Kentucky" title="Kentucky"> <area shape="poly" coords="153,177,143,244,144,280,127,287,115,286,113,272,83,271,78,264,86,249,93,239,89,228,88,212,90,202,97,192,105,178" href="#" onMouseUp="javascript: changemap('mississippi');" alt="Mississippi" title="Mississippi"> <area shape="poly" coords="87,226,17,227,16,212,7,212,3,128,108,130,107,142,113,142,120,128,121,131,121,141" href="#" onClick="javascript: changemap('arkansas');" alt="Arkansas" title="Arkansas"> <area shape="poly" coords="246,118,255,98,272,87,284,64,283,11,265,17,258,25,241,31,217,18,187,18,190,81,218,90,224,87,232,92,235,100" href="#" onClick="javascript: changemap('ohio');" alt="Ohio" title="Ohio"> <area shape="poly" coords="124,116,128,121,120,128,111,140,109,129,23,127,21,70,15,60,2,33,74,33,79,39,78,51,95,76,103,77,100,87,101,95,108,103,113,111,114,118" href="#" onClick="javascript: changemap('missouri');" alt="Missouri" title="Missouri"> <area shape="poly" coords="129,117,131,109,136,104,138,91,144,80,142,19,137,4,99,3,102,14,94,22,87,22,90,34,81,45,78,50,94,75,105,77,103,88,104,97,112,107,116,114" href="#" onClick="javascript: changemap('illonois');" alt="Illonois" title="Illonois"> <area shape="poly" coords="204,177,109,176,123,139,249,139" href="#" onMouseUp="javascript: changemap('tennessee');" alt="Tennessee" title="Tennessee"> </map> <map name="arkansas"> <area shape="rect" coords="240,135,284,163" href="/branches/westmemphis.php" alt="West Memphis" title="West Memphis"> <area shape="circle" coords="209,143,7" href="/branches/westmemphis.php" alt="West Memphis" title="West Memphis"> <area shape="rect" coords="130,275,283,290" href="#" onClick="javascript: changemap('regionview');" alt="Overview" title="Overview"> </map> <map name="mississippi"> <area shape="rect" coords="20,177,64,191" href="/branches/jackson.php" alt="Jackson" title="Jackson"> <area shape="circle" coords="103,183,8" href="/branches/jackson.php" alt="Jackson" title="Jackson"> <area shape="rect" coords="217,198,277,214" href="/branches/hattiesburg.php" alt="Hattiesburg" title="Hattiesburg"> <area shape="circle" coords="175,208,7" href="/branches/hattiesburg.php" alt="Hattiesburg" title="Hattiesburg"> <area shape="rect" coords="222,96,279,111" href="/branches/columbus.php" alt="Columbus" title="Columbus"> <area shape="circle" coords="195,106,8" href="/branches/columbus.php" alt="Columbus" title="Columbus"> <area shape="rect" coords="222,71,261,85" href="/branches/tupelo.php" alt="Tupelo" title="Tupelo"> <area shape="circle" coords="174,84,6" href="/branches/tupelo.php" alt="Tupelo" title="Tupelo"> <area shape="rect" coords="130,275,283,290" href="#" onClick="javascript: changemap('regionview');" alt="Overview" title="Overview"> </map> <map name="missouri"> <area shape="rect" coords="195,262,243,275" href="/branches/sikeston.php" alt="Sikeston" title="Sikeston"> <area shape="circle" coords="216,199,7" href="/branches/sikeston.php" alt="Sikeston" title="Sikeston"> <area shape="rect" coords="247,173,280,186" href="/branches/ozora.php" alt="Ozora" title="Ozora"> <area shape="circle" coords="206,182,6" href="/branches/ozora.php" alt="Ozora" title="Ozora"> <area shape="rect" coords="232,158,278,169" href="/branches/sullivan.php" alt="Sullivan" title="Sullivan"> <area shape="circle" coords="194,165,7" href="/branches/sullivan.php" alt="Sullivan" title="Sullivan"> <area shape="rect" coords="228,128,275,142" href="/branches/stlouis.php" alt="St. Louis" title="St. Louis"> <area shape="circle" coords="206,137,8" href="/branches/stlouis.php" alt="St Louis" title="St Louis"> <area shape="rect" coords="198,97,258,112" href="/branches/wentzville.php" alt="Wentzville" title="Wentzville"> <area shape="circle" coords="182,130,6" href="/branches/wentzville.php" alt="Wentzville" title="Wentzville"> <area shape="rect" coords="130,275,283,290" href="#" onClick="javascript: changemap('regionview');" alt="Overview" title="Overview"> </map> <map name="kentucky"> <area shape="rect" coords="24,218,72,231" href="/branches/paducah.php" alt="Paducah" title="Paducah"> <area shape="circle" coords="46,190,6" href="/branches/paducah.php" alt="Paducah" title="Paducah"> <area shape="rect" coords="35,127,95,141" href="/branches/henderson.php" alt="Henderson" title="Henderson"> <area shape="circle" coords="63,174,7" href="/branches/henderson.php" alt="Henderson" title="Henderson"> <area shape="rect" coords="94,218,175,232" href="/branches/bowlinggreen.php" alt="Bowling Green" title="Bowling Green"> <area shape="circle" coords="127,188,6" href="/branches/bowlinggreen.php" alt="Bowling Green" title="Bowling Green"> <area shape="rect" coords="108,75,159,90" href="/branches/louisville.php" alt="Louisville" title="Louisville"> <area shape="circle" coords="144,130,7" href="/branches/louisville.php" alt="Louisville" title="Louisville"> <area shape="rect" coords="179,75,232,89" href="/branches/georgetown.php" alt="Lexington" title="Lexington"> <area shape="circle" coords="193,127,8" href="/branches/georgetown.php" alt="Lexington" title="Lexington"> <area shape="rect" coords="130,275,283,290" href="#" onClick="javascript: changemap('regionview');" alt="Overview" title="Overview"> </map> <map name="indiana"> <area shape="rect" coords="18,199,73,213" href="/branches/vincennes.php" alt="Vincennes" title="Vincennes"> <area shape="circle" coords="110,204,6" href="/branches/vincennes.php" alt="Vincennes" title="Vincennes"> <area shape="rect" coords="210,180,273,193" href="/branches/clarksville.php" alt="Clarksville" title="Clarksville"> <area shape="circle" coords="187,186,6" href="/branches/clarksville.php" alt="Clarksville" title="Clarksville"> <area shape="rect" coords="211,117,276,132" href="/branches/indianapolis.php" alt="Indianapolis" title="Indianapolis"> <area shape="circle" coords="159,124,5" href="/branches/indianapolis.php" alt="Indianapolis" title="Indianapolis"> <area shape="rect" coords="211,101,250,113" href="/branches/muncie.php" alt="Muncie" title="Muncie"> <area shape="circle" coords="178,116,7" href="/branches/muncie.php" alt="Muncie" title="Muncie"> <area shape="rect" coords="212,46,257,60" href="/branches/fremont.php" alt="Fremont" title="Fremont"> <area shape="circle" coords="185,55,7" href="/branches/fremont.php" alt="Fremont" title="Fremont"> <area shape="rect" coords="36,73,92,86" href="/branches/ftwayne.php" alt="Ft. Wayne" title="Ft. Wayne"> <area shape="circle" coords="179,79,5" href="/branches/ftwayne.php" alt="Ft. Wayne" title="Ft. Wayne"> <area shape="rect" coords="36,109,87,121" href="/branches/lafayette.php" alt="Lafayette" title="Lafayette"> <area shape="circle" coords="138,113,6" href="/branches/lafayette.php" alt="Lafayette" title="Lafayette"> <area shape="rect" coords="130,275,283,290" href="#" onClick="javascript: changemap('regionview');" alt="Overview" title="Overview"> </map> <map name="illonois"> <area shape="rect" coords="28,184,89,197" href="/branches/estlouis.php" alt="East St. Louis" title="East St. Louis"> <area shape="circle" coords="126,192,6" href="/branches/estlouis.php" alt="East St. Louis" title="East St. Louis"> <area shape="circle" coords="148,153,5" href="/branches/effingham.php" alt="Effingham" title="Effingham"> <area shape="rect" coords="218,146,273,159" href="/branches/effingham.php" alt="Effingham" title="Effingham"> <area shape="rect" coords="219,120,260,134" href="/branches/urbana.php" alt="Urbana" title="Urbana"> <area shape="circle" coords="164,130,6" href="/branches/urbana.php" alt="Urbana" title="Urbana"> <area shape="rect" coords="130,275,283,290" href="#" onClick="javascript: changemap('regionview');" alt="Overview" title="Overview"> </map> <map name="tennessee"> <area shape="rect" coords="0,199,49,213" href="/branches/memphis.php" alt="Memphis" title="Memphis"> <area shape="circle" coords="25,170,7" href="/branches/memphis.php" alt="Memphis" title="Memphis"> <area shape="rect" coords="41,80,90,94" href="/branches/jacksontn.php" alt="Jackson" title="Jackson"> <area shape="circle" coords="64,149,8" href="/branches/jacksontn.php" alt="Jackson" title="Jackson"> <area shape="rect" coords="130,275,283,290" href="#" onClick="javascript: changemap('regionview');" alt="Overview" title="Overview"> </map> <map name="ohio"> <area shape="rect" coords="49,221,105,237" href="/branches/cincinatti.php" alt="Cincinatti" title="Cincinatti"> <area shape="circle" coords="74,162,7" href="/branches/cincinatti.php" alt="Cincinatti" title="Cincinatti"> <area shape="rect" coords="6,138,46,151" href="/branches/dayton.php" alt="Dayton" title="Dayton"> <area shape="circle" coords="91,146,6" href="/branches/dayton.php" alt="Dayton" title="Dayton"> <area shape="rect" coords="130,275,283,290" href="#" onClick="javascript: changemap('regionview');" alt="Overview" title="Overview"> </map> This is exactly how it is in my html files. I really appreciate any input, suggestions or comments you can give me. Thanks in advance! 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. so im using firfoxes firebug and its giving me this java script error missing ; before statement document.getElementById("aia").innerHTML = "<p onclick="" >Sword</p>"; i tried just puting this ; behind the beginning but i just cant figure it out. Hi all, I'm faced to a problem : I'm programming a styles generator for the Stylish add-on. What i want is the same thing that when i click on the button "Install with Stylish" : A Window appear to ask user if he wants to install the script with Stylish. I saved the website page on my desktop and opened it. Obviously it did not worked, nothing happens when i click. I also changed the path for javascript file in the html and so on.. There is a XMLhttprequest() function wich opens the url of the style ending by ".css". But i replaced the url by my file path ( by a locally file) and i replaced the statut (200 by 0, because i'm working on a local file). But whatever i do, nothing happens when i click. There is also a function called firecustomevent() who creates the event, but my knowledges are limited at this point. I read document on mozilla website on how to call an event but i can't get it to work. So if anybody knows how to display a windows asking the user if he wants to install the style, i will be grateful. Thanks and sorry for my bad english The url containing the javascript is a simple style url like this one : http://userstyles.org/styles/17120 where you can see the "install with stylish" button. I also attached the concerned javascript in a txt file. Hi, This problem has completely stumped me, was hoping from a bit of advice. I have used the code of my affiliate software to show my company logo. This code works in Firefox, but for some reason doesn't work in IE. The company who own the affiliate software have never seen this problem before and have been unable to assist. Not sure if it's a server problem? To see the problem have a look at logo at the top of my test website in firefox then IE. http://www.nctshop.co.uk/staging/ Here is a snippet of the code below. It is the line where it links to nctshopaffiliate which is where the problem lies. Thanks! Adrian Code: <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr><td class="topnav1bgcolor"> <table width="100%" border="0" cellpadding="0" cellspacing="0"> <tr> <td valign="top"><a href="../default.asp"><script language="JavaScript" type="text/javascript" src="http://www.nctshopaffiliate.co.uk/display.php?token=logo" alt="NCTSHOP" width="650" height="89" border="0"/></script></a></td> <td align="right" valign="top"> <table width="223" border="0" cellpadding="0" cellspacing="0"> <tr><td height="5" colspan="5"><img src="images/clear.gif" alt="" style="width:1;height:1;border:0"></td></tr> <tr><td colspan="5"> </td></tr> <tr><td height="25" colspan="5"><img src="images/clear.gif" alt="" style="width:1;height:1;border:0"></td></tr> <tr> <td class="plaintext"><a title="View Basket" href="basket.asp"><img src="images/newcart_Img.gif" alt="View Basket" style="width:23;height:12;border:0"></a></td> <td><img src="images/clear.gif" alt="" style="width:5;height:1;border:0"></td> <td style="background-image:url(images/bkg_cartinfo.gif);height:21"> <table width="200" border="0" cellpadding="0" cellspacing="0" > <tr> <td class="plaintext" align="center"><a title="View Basket" href="basket.asp"><span class="plaintext"><u>Items</u></span></a> <%=session("SL_BasketCount")%> | Sub Total <%=formatcurrency(session("SL_BasketSubTotal"))%></td> </tr> </table> </td> <td> </td> <td><a class="topnav1" title="Checkout" href="<%=session("secureurl")%>custinfo.asp" ><u>Checkout</u></a></td> </tr> </table> </td> <td style="width:10"><img src="images/clear.gif" alt="" style="width:1;height:1;border:0"></td> </tr> </table> </td> </tr> </table> Hi, I am using googles O3D software and it uses a javascript base, one of there plugins works in Firefox only and not Internet Explorer I was wondering if anyone here could help me find out why it isnt working in IE and even how to fix it, here is the page that works in firefox but not IE http://o3d.googlecode.com/svn/trunk/...edesigner.html Many Thanks, Simon I'm new to HTML and javascript programming, so I apologize if the solution to this is blatantly obvious. I've got expanding text / menus in javascript on my page. These all work in IE with no problems that I can tell. Unfortunately, when I view the page in Firefox, only the first expanding menu is actually a link and works - the rest do not even appear as links and don't work (and the expanded text isn't showing either). You can visit the page at http://www.scienceadvice.ca/uploads/...s/may2010.html Any help would be most appreciated! Thanks! |