JQuery :: Matching Passed Parameter To Image Map Areas
Aug 23, 2010
I am trying to match a passed parameter on a url to an area on an image map. So far I can find the correct area using
Code:
$('#mediummap area').each(function(i){
href = $(this).attr('href');
if (href == id) {
alert('Found ID ' + id);
}});}});
But next I need to retrieve the co-ordinates for the Area. I have tried
Code:
coords = $('this').attr('coords');
And
Code:
coords = $('this').coords();
I can not seem to get the value back, just an undefined return. What I want to do is to find the point on the image map and then centre that point with in the viewport for the image (large image, small viewport).
I'm passing the id of a div as a parameter. I'm not sure how to refer to it with Jquery. The following does not work: Code: function updatemail(param1, param2) { $("#param2").animate({ opacity: "show" }, 300); } I also tried $(param2) but it did not work.
I have downloaded 2 html pages that give me page1 with a drop down box for a list, and a 'show' button. this then passes dropdown value to page2 and JS presents the text on the page, but I want to use the passed parameter to change the src of an img with ID=img1.can post all the JS if you like but assume i am missing just a one liner replacing the ....
var name = getValue("name"); document.write(name);
I have a strange problem... I have a form with a text area that contains an XML document. This document can be modified by the user.
Once the document has been modified, the user pressed the "Submit" button to submit the modification (onclick=modify())... and go to another jsp page.... in my javascript, I have the following code:
function modify() { myRand=parseInt(Math.random()*99999999); // cache buster var docXML=document.forms[0].xml.value; var plist="myRand="+myRand+"&docXML="+escape(docXML); url="modify_xml.jsp?"+plist; document.forms[0].action=url; document.forms[0].submit(); }
With Firefox, the problem does not occur.... but with Explorer, the form is not even submitted!!!!! Is there a workaround for this? The XML document is not even very big.
New to JS. Have ordered some new books, but need to get somethings going in the mean time. What I wanted to do is to link to a new page having a date range input in the form of 6 text boxes, 2 sets of mm-dd-yy, from and to, where the upon loading the page box 1 of the from would auto focus and then auto tab and then post where php could take over on the server side. Setting up the form and the lay out, no problem. Auto focusing went just like expected using the following code, included because on the next step everything fell apart.
So then the wheels came off and in response, began to simplify what was trying to be done to find where the issues were. As far as I can get working is: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "[URL]"> <html> <head> <script type="text/javascript" > window.onload=function() { document.getElementById("input1").focus(); } </script> <script type="text/javascript" > function myFunc() { alert("is this working"); } </script> </head> <body> <input id="input1" name="input1" type="text" onkeyup="myFunc()" maxlength="2" value="type a No." /> </body> </html>
First issue with this: When I first get to the page everything is just as ordered. The focus is on the text box and the default value is "type a No." When I press a key onkeyup, I bring up the alert box with "is this working" in it. But when I refresh the page with the refresh button, after clicking the "ok" on the alert box, the character that was typed in is still displayed. If I use the link to the page, or the URL from the address bar, then the page reloads properly with the default value, "type a No".
How do you get the default textbox value using the refresh button as apposed to reloading the page using a link or from the address bar? Using Firefox 8.0 more important at the moment: If I change the script to pass an argument to the function the script crashes. It does not pull up an alert box and freezes. My guess is that I'm doing something wrong on a concept level. Changed the default value of the text box to " ". Looked like to me there was an issue with the size specification and the default string length as you could only enter in a key stroke by highlighting the text and replacing it.
I am looking for a plugin for jQuery to mark areas on image and select a friend like you can do it in some social networks to mark your friends on fotos!
var myDIVnode1 = document.createElement("DIV"); // etc myDIVnode1.appendChild(document.createTextNode("a")); // this shows "a" alert(myDIVnode1.firstChild.nodeValue);
I posted a similar thread about this in the .NET forum, but I thought maybe there was a javascript way of doing what I need to do.Is there a way to redirect a user to another page while keeping the passed in #parameter?For example, if the user clicks the link:
The idea is simple, one area map replaces the image with image A, the other area map replaces the image with image B sort of like this page. The code I have so far is below. How this is supposed to go?
Code: img.imenu {margin: 2px 0px; height: 20px; width: 175px; border-width: 0px; border-width: 0px; margin-top: 2px; margin-bottom:2px;} </style> <script type="text/javascript"> function mouseOverMap(area) { if (var image = document.getElementById("TheMap")){ image.src = image.src.replace("old.png","new.png"); } else if (var image = document.getElementById("TheMap2")){ image.src = image.src.replace("old.png","new2.png"); } function mouseOutMap(area) { var image = document.getElementById("TheMap"); // not sure what you want to do with this image.src = image.src.replace("new.png","old.png"); } </script>
I have been asked to make a page for a website that wants a series of rollover images and when you roll over a particular image, there are 2 buttons to choose from which take you to another area of the site. I am a bit stuck -I know how to create a simple rollover image...but is there a way to create a rollover image that when you rollover it, yiou can choose from 2 different hyperlinks?(ie. two hotspots I think?) An example of the page is shown below: Before rollover: [URL] After Rollover: [URL]
I cannot get javascript to change an image to make a "pressable" button when select areas of an image map are clicked. I used index.html for testing purposes.
I have been working on this issue for a couple of days. I have image names stored in my mysq. database. I need to somehow get those image names from the mysql database to a jquery array.Here is what I have so far.
As you can see I am totally lost, I have been trying to work this out for several weeks now without any progress, I need to make about 20 of these displays each include 4 buttons that will none/block the related text area below the display for a visual please see: Code:
I have searched the forum and internet and experimented a lot with .each but couldn't get this to work:I have several divs with id="flash", and I want them all to flash when the site loads. Using this code only the first div flashes:
I'm trying to do is simple "select all" checkbox script. The problem is, no matter what I seem to do, only first element is matched. $("input:checkbox").attr("checked", true); checks the first box only. Same with: $("input:checkbox").each(... I even tried copying this script directly from the jQuery documentation page: $("div").css("border","9px solid red"); It applies a red border to the first div on my page.. the example in the documentation applies it to all divs.
Trying to hide a table that's a sibling to the anchor to which theclick event is being called. It works, with any element but a tableas a sibling. My code/markup:
This should be pretty simple one ,yet I can't seem to figure it out. There are posts that are similar to my question on here, but they don't really answer my questions. The a user comes to the page, they're at a URL like such: [URL]..
This is sort of a design/javascript question. It involves CSS rendering in dynamic areas of a page using IE.
E 6 & 7
HI There, We've created some example static html pages (using CSS) that look great in IE. We are now converting these into dynamic pages that use javascript to dynamically update certain areas of the page. After the conversion the dynamic areas of the page do not render the CSS styles (the styles are not displaying correctly). This only happens in IE. The styles display correctly for other browsers (firefox).
I am using the javascript DOM to update the dynamic areas of the site. For example when creating a <atag that needs attribute class=over....I add the following code.
i am using two textareas for editing by tinymce, its working fine in ie and ff but in safari it is opening the first textarea editor only. This was my code.
tinyMCE.init({ // General options mode : "textareas", //mode : "exact", elements : "description,pedigree", theme : "advanced", [Code]....
I would like to build an HTML page that has four content areas. The first with 3 links that when clicked chage what is shown in the other 3 - and so changing the default content in these sections. The content for these sections will be contained in seperate HTML files sitting on the same server.
I understand this can be done without refreshing the page and believe JavaScript and Ajax is the best method to do this. Any advice?
I came across JQuery when searching for a solution to get matching column height with Divs. I have downloaded JQuery which appears to be one file named jquery-1.3.2.min I also have the following short script that I found, which I believe goes in the head area of the page.
The script works with jquery.
HOW TO DO:
1. I assume I need to rename my download file jquery-1.3.2.min to jquery.js ?
2. Do I need to edit the jquery file somehow in order to get the above script to work?
<div> </div><div>I just found out that jQuery can match on partials,.. is this correct?</div><div>and if so how do I make it match on the whole text.</div><div>[code]......
