JavaScript - Textarea Not At Absolute Mouseclick Location In Ie, Works In Ff
Hi,
So here is my ordeal. I have an image that when a user clicks, a textarea should show up at the click. I specify textarea style top and left in javascript. On Firefox this works fine, but in Internet Explorer (IE) the textarea is created right before the image instead of on top of the image. It is like that it just ignored the top and left positions. Also, users can query the database to show all the (mouse clicked) textareas that were created on the image. I coded this using PHP and a bunch of echo's. For some reason, the PHP code works with the CSS styles top and left specified meaning the textareas show up fine on top of the image. But creating a brand new textarea with a mouse click in javascript is not working. Can someone help me figure out what I'm doing wrong for IE? Thanks! Here is the javascript (does not work in IE, works in FF): Code: function createTextArea(e){ getMouseCoords(e);//sets posy, posx var newDiv= document.createElement("textarea"); newDiv.setAttribute("name","comment[]"); newDiv.style.visibility="visible"; newDiv.style.top= (posy) +'px'; newDiv.style.left= (posx) +'px'; newDiv.style.overflow="hidden"; // append to the document FORM var form=getTagFromArray("form","commentform"); form.appendChild(newDiv); } HTML that calls javascript: Code: <img id="theImage" src="random.gif" border=1 onclick="createTextarea(event);"> Here is the php when I load the textareas from the database (works in both IE & FF): Code: //get data from database //forloop for each textarea saved in database echo "<textarea name=\"comment[]\" style=\"top:".($locy)."px;left:" .($locx)."px;overflow:hidden;visibility:hidden;\" >".$row['comment']."</textarea>"; //end forloop Similar TutorialsHow can I play a sound when I click an image, without the information bar popping up at top? I've looked all over, and I've tried a few javascript-only methods but none have worked for me.. Is flash the only way to go?
Hello, I am not the best JS programmer, but I was wondering... Is there a way to do this: HTML Document /w/ 2 frames, A & B. When you click a button in frame A: "Click" (X,Y coords) in frame B. If that's not possible in JS, please let me know what language I need. - Waffles Code: <script language="JavaScript" type="text/javascript"> function confirmDelete(url){ var decision = confirm("Click OK to delete this post."); if(decision == true){ window.location = url; } } </script> <!--HTML LATER ON --> <a onclick="confirmDelete('deletePost.php?id=17')" href=''><img src='delete.png' alt='' title='Delete this post' /></a> I get absolutely nothing out of this. The confirm box pops up, but a the URL never changes when I click OK. I have no clue what's going wrong here. I'm using Google Chrome to test this out if that helps. Also does not work in Firefox. Hi, I'm using the following Javascript code to show a div layer depending on the URL Code: <script type="text/javascript"> if (location.href.match(/folder/)) { document.getElementById("div-layer").style.display="block"; } </script> This works perfectly when I visit http://www.domain.com/folder but I do not want it to match any subfolders beneath /folder, for example: http://www.domain.com/folder/sub-folder http://www.domain.com/folder/sub-folder2 etc. Does anyone know how I can modify the code to only match /folder or /folder/ and no subfolders beneath it? Thank you in advance. What are the differences between results of these two. Code: window.location.hostname or Code: document.location.hostname Hi i have a problem, i've been trying to fix this for the whole day pls see my code below Code: for ($o = 0; $o <= $totalclass; $o++) { for($i = 1; $i <= 45; $i++) { if ($_SESSION['classification'][$o] == $i) { $sql2="SELECT ClassDesc FROM tblclass WHERE ClassID = '$i'"; $result2=mysql_query($sql2); // If successfully queried if($result2) { while ($row2 = mysql_fetch_assoc($result2)) { $ClassDesc2 = $row2['ClassDesc']; } } //echo $ClassDesc2; ?> <tr> <td bgcolor="FAFAF6" class="small" valign="top">Class <? echo $i; ?></td> <input type="hidden" name="<? echo "classid[]"; ?>" value="<? echo $i; ?>"> <td bgcolor="FAFAF6"> <textarea name="<? echo "specification[]"; ?>" COLS="50" ROWS="6" class="small" wrap="virtual" tabindex="<? echo $i; ?>"><? echo $ClassDesc2;?></textarea> <input type="button" value="Reset" onclick="window.reset();" name="reset"> </td> </tr> <? } } } i've trying to create a button or image to reset one textarea (from whole array) and so far i've been unsuccessful. i've seen this on other website and i know it is possible to do this, pls help! Hi there im making a estate agency website for my college assignment and have come across a problem when using windows.location for some reason it is not working what i want to do is go to a page when searching the right content and then clicking the submit button so when i type hello for example into the text box i want to get relocated to renting1.html page but for some reason it is not working i know that the variable is set up right as if i change the content of the if statement to an alert then that works can anyone spot a problem in my code snipit <form id="form1" method="post" action="" > <label>Search House Name: <input name="Search" type="text" id="Search" size="50" /> </label> <label>Search <input type="submit" name="Search2" id="Search2" value="Submit" onclick="testResults()" /> </label> <script type="text/javascript"> function testResults() { var TestVar = form1.Search.value; if(TestVar=="hello") window.location = "renting1.html"; else alert("Invalid"); } </script> thanks for any help dave Im currently creating a Table with 2 frames (table in top, last row clicked in bottom) Code: <html> <frameset rows = "60%, 40%"> <frame src = "table_driver.php" name = "A" id = "FRAME1"> <frame src = "bottom_row.php" name = "B" id = "FRAME2"> </frameset> </html> In bottom_row.php I have one object, a [obj = new TableData()]. onClick of a row in FRAME1, obj is initialized to what was clicked and the row is changed. anyways currently I have it working but want it such that it can work with multiple frames, with a location parameter. this is currently what I have Code: function TableData(headers, row, loc) { this.headerArr = headers; this.rowArr = row; this.myLoc = loc; { parent.B.document.close(); parent.B.document.open(); parent.B.document.write('<table id = "copyTable" border = "1">'); for(i=0; i<this.headerArr.length; i++) { parent.B.document.write('<tr><th>'); parent.B.document.write(this.headerArr[i]); parent.B.document.write('</th><td>'); parent.B.document.write(this.rowArr[i]); parent.B.document.write('</td></tr>'); } parent.B.document.write('</table>'); } } parent.B gets me FRAME2 and I want to either do: parent.this.myLoc parent.loc parent.myLoc but I havent had any luck with any of these. it is a javascript function any ideas? thanks! Can someone tell me how to change the following code so that it will open in a new window? (like target="_blank" in html) Code: if (phone_num=="1234") document.location="http://mysite/formgov/makeadifference.html"; I have searched for hours trying to find a solution and have tried many things, nothing has worked. The example shown above is just one of many urls that I want to change. Any help would be appreciated. Maybe this is not possible. I know nothing about javascript. Sorry my bad, but im stuck again. I have tried to search in hours, but i cant find the answer. I think you the pro coders will see the code directly. I have an webbpage, and in the middle of it there is an iframe to a php site. So i have used this code, so after some seconds the iframe will send the guest to another page. <meta http-equiv="refresh" traget="_top" content="5 url=http://mypage.com"/> But the thing is that i want the WHOLE page to reload, and go to that page after 5 seconds (we can say). With that code, only the iframe are going to another page. Is it possible to make the whole page send the user after some seconds, to another page and not only the iframe? Can someone see a difference between: <input type="submit" name="Submit" value="Start" onClick="javascript:location.href='Poll_Jan2010_01.html'"> and: <input type="submit" name="Submit" value="Next >" onClick="javascript:location.href='Poll_Jan2010_02.html'"> ??? Because the first works, but the second doesnt :/ All i wanna do is move on to the next page by clicking a submit button. From the first page it moves to second correctly. After that, it only refreshes the page and doesnt move on... We list our branches on our webpage, but I want people to be able to search for the nearest ones. This is the form I built as a place holder... but I'm sure I need a "little something" to go along with it. ha ha ha. Code: <form class="login">   <label class="white"><b>Zip Code</b><br />   <input name="zip" type="text" maxlength="5" size="10"/> </label> <br /><br /> <label>   <input type="submit" name="submit" id="submit" value="Go!" class="btn" /> </label> </form> I would like to sort them in order of closest to furthest (or even just display the top 5)... where would I find something like that? I seem to be having a difficult time with my searches in google and otherwise. Anyone have any ideas? every time i try something it doesn't work for me god why is this javascript so hard to make it work... anyway, i just followed the guidelines to pass values from one page to another using ? and it simply, like always, DOES NOT work Code: <HEAD> ... ... <script type="text/javascript"> <!-- function sendme(){ if (document.form1.question[0].checked == true) { whichone = 1; } if (document.form1.question[1].checked == true) { whichone = 2; } if (document.form1.question[2].checked == true) { whichone = 3; } if (document.form1.question[3].checked == true) { whichone = 4; } if (document.form1.question[4].checked == true) { whichone = 5; } if (document.form1.question[5].checked == true) { whichone = 6; } if (document.form1.question[6].checked == true) { whichone = 7; } if (document.form1.question[7].checked == true) { whichone = 8; } myString = qst1 + "=" + whichone; location.href = "Poll_Jan2010_02.html" + '?' + myString; } //--> </script> </head> <body> <div align="center"> <p><img src="63/images/poll_logo.jpg" width="655" height="92"> </p> <p> </p> <h2><u>Question 1</u></h2> <p><strong>Bla bla bla bla...</strong></p> <form name="form1"> <table width="60%" border="0"> <tr> <td><input name="question" type="radio" value="Grill"> option 1</td> </tr> <tr> <td><input name="question" type="radio" value="Club"> option 2</td> </tr> <tr> <td><input name="question" type="radio" value="Crepes"> option 3</td> </tr> <tr> <td><input name="question" type="radio" value="Sandwiches"> option 4</td> </tr> <tr> <td><input name="question" type="radio" value="Hotdog"> option 5</td> </tr> <tr> <td><input name="question" type="radio" value="Special"> option 6</td> </tr> <tr> <td><input name="question" type="radio" value="Refreshments"> option 7</td> </tr> <tr> <td><input name="question" type="radio" value="Salads"> option 8</td> </tr> </table> </form> <p> <a href="#null" class="style2" onclick="sendme();">Continue ></a> </p> </div> </body> if location is a property of window object that returns a string and im appending .indexOf() to location why is it not working?
Hello In phase of my deployment I send the user a window from a servlet and inorder to communicate with an applet already loaded in another window in the browser I thought I could set the window.opener.location="${formbean.property}"; and it partly works, it get set, I see the new window flash, but it then executes that url. Two questions? 1. setting the window.opener.location in an onLoad() should not force a post back to the server, correct? I am just trying to keep that window I want up there and set an internal property so I can access the applet in the other window. Trying to make this "synthetically" a child of that page opened with the applet so I can call the applets methods simply. 2. Is there another way for a new browser window to directly access an applet in another page? I could go the route of making a probe applet and hoping they share the same JVM, (JRE1.6.0.25) access it that way. Is/how that the way to do it? i need typing cursor back in first text box after clicking ok of alert [CODE] <html> <head> <script type='text/javascript'> function player() { document.getElementById("Player2").value= document.getElementById("Player1").value; } function notEmpty(elem, helperMsg){ if(elem.value.length == 0){ alert(helperMsg); elem.focus(); return false; } return true; } </script> </head> <body> <form> Player:<input type="Name" id="Player1" onkeyup="player()"/> <input type="Name" id="Player2" DISABLED /> <input type='button' onclick="notEmpty(document.getElementById('Player2'), 'Please fill in player field!')" value='Submit' /> </form> </body> </html> [ICODE] I'm trying to make a map that will show your current location, but also load an xml file to show certain attractions in your area. I have the code to work for getting your current location, but I can't figure out how to implement loading the xml file and placing markers based off of that xml file. Here is the code for getting my location: Code: function show_position(p) { document.getElementById('current').innerHTML="latitude="+p.coords.latitude.toFixed(2)+" longitude="+p.coords.longitude.toFixed(2); var pos=new google.maps.LatLng(p.coords.latitude,p.coords.longitude); map.setCenter(pos); map.setZoom(14); var infowindow = new google.maps.InfoWindow({ content: "<strong>yes</strong>" }); var marker = new google.maps.Marker({ position: pos, map: map, title:"You are here" }); google.maps.event.addListener(marker, 'click', function() { infowindow.open(map,marker); }); } </script > Can anybody help me figure this out? Thank you in advance Hi, I have a requirement of parent and child window. Onclick of a link on the parent page i am opening a child window with "window.location". On the child window i am displaying a jsp with the overlap screen on the parent screen using DOJO. After doing all the action on the child page when i am about to close the child window which is having button like cancel,close i am hiding the overlap screen. But my actual concern is when i close the child window, my parent page's scroll bar is scrolling down to the bottom of the page which should not happen and it should be there at the top of the page. How can i acheive this behaviour. Can anyone help me in this. Thanks in advance If you go to: http://ocmd.freehostia.com/tbb/ You'll see that when the user presses enter, it goes to another page. Currently, in the scripts part of my page is this: Code: function checkKey() { if (window.event.keyCode == 13) { var audioElement = document.createElement('audio'); audioElement.setAttribute('src', 'horse.ogg'); audioElement.play(); window.location = "google.html"; return false; } } Notice how I'm trying to play an audio file? Well, I need for the window.location to go after the audio file plays, or alternatively for it to be played after xx milliseconds. Thank-you. Hey guys. I'm currently paying for a web service on a hosted platform. Basically, I'm unable to edit any raw content, however I am able to do things like add JS/HTML to the header or footer of a page, which will in turn be displayed on every page of this platform. My dilemma is, I only want content being showed on a single page of the platform. Specifically, I want a window.alert being displayed on the "/signup" page, but all I have to work with is JS in a global footer. Is there some way I can use window.location to achieve this? |