Multiple JS Hover Popups ?
Jan 21, 2010
I'm trying to have an ordered list, each item with its own image. Then, I'm trying to use JS so that a different popup is generated for each image.
Currently, I'm using CSS classes to define the appropriate popup image, and this seems to work fine as I can see the popup contents in Dreamweaver.
I think the issue is the 'getElementById' thingy. As whichever image I hover over, it always pulls the first hidden popup.
JS
Code:
HTML
Code:
CSS
Code:
Is there a way form me to also pull the class that is referenced in the html, so that the appropriate popup is generated?
I don't think I'm using the code highlighting properly and I intended to link to the page, so you could see what I'm talking about, but apparently that's not allowed.?
View 2 Replies
ADVERTISEMENT
May 4, 2010
I am a javascript newbie and trying to write a script to create hover-over popups for a product page. It works like a charm when I assign it a solo "div#id" and "a#id", however I need it to work on multiple objects.I can't use a classbecause then everything with the classname pops up at the same time. So each popup HAS TO have a unique ID. I am trying to write a for each statement, but it doesn't seem to be working... any ideas... or better ways to execute this...
This is the one that works (but only for one):
<script type='text/javascript'>
$(document).ready(function(){
$( 'a#popup').hover(function(){
$('div#popupBox').fadeIn(500);
},function(){
$('div#popupBox').fadeOut(500);
});
});
</script>
This is my current for each equiv (Not Working):
<script type='text/javascript'>
for (i = 1; i < 12; i++){
varthis_a='a#popup' + i;
varthis_div='div#popupBox' + i;
$(this_a).hover(function(){
$(this_div).fadeIn(500);
},function(){
$(this_div).fadeOut(500);
});
}
</script>
View 2 Replies
View Related
Oct 11, 2005
i'm working on my band's website and I want to be able to make multiple popups on one page. as in, the links you press will all come up in DIFFERENT popup (barless) windows. but no matter what i try, no matter what link you press they all come up in the same popup window. im hoping to make all the links come up in different sized seperate windows! anyone know how to do this?
View 7 Replies
View Related
Mar 20, 2009
I've lost almost half a day to identify/recover this script error.I often got this type of error.
I've parent window with two text field.There user can either enter the value on the field or choose popup option to search & select the value.When user open the popup & selects value, the selected value gets populated to parent window text field & close popup window. Everything working well, but sometimes after closing popup window, it keeps on opening same popup window multiple time until my internet explorer get crashed. It happens only in IE.
Here is the snippet of parent window:
Here is the snippet of popup.html:
View 1 Replies
View Related
Feb 23, 2011
im currently creating a dropdown menu with an animation to it, my current jquery script is as follows
$(document).ready(function () {
$("ul.menu_body li:even").addClass("alt");
$('ul.menu_body, img.menu_head').hover(function () {
[code]....
View 2 Replies
View Related
Sep 24, 2009
Is it possible to swap the link image that is hovered with another image and at the same time swap different images on another place on the page? I was trying to do it in CSS but I couldn't figure out how to do both at the same time. Basically I want to go from:
after hovering over linkimg1. I can get it to do both separately but not at the same time unless I am missing the combining factor or something. Let me know if you need anything else (i.e. site, missing code) Here's the code I'm working with:
HTML Code:
[Code]...
View 1 Replies
View Related
Sep 9, 2010
Im trying to get 2 elements to execute some effect individually at the same time on a hover.Ive looked at .animate but if I understand it correctly I can do multiple effects but still limited to that single element.[code]So basically Im just trying to get 1st & 2nd on hovers to happen at the same time and 1st and 2nd off hovers to happen at the same time.
View 1 Replies
View Related
Jun 2, 2011
Is it possible to use multiple JQuery Effects for navigation hover? For example, a navigation button that changes colors and shapes, such as when the user hovers over the button, the button first turns red then fades to blue...something of that nature? Or is JQuery even the right tool to do such a thing?
View 1 Replies
View Related
Mar 6, 2010
In the past I've done image rollovers and that's fine. I got scripts for those, and got them to switch fine. But what I want to do is edit the backgroudn color of a TD, which is code defined, and not an image. Anyways, the basic thing I'm doing is a table that hold lots of numbers. I'm creating a "times table" - which looks roughly something like this:
......1 2 3 //top row (multiples)
1.....1 2 3
2.....2 4 6
3.....3 6 9
Now, when you rollover, let's say, the '6' - the TD background color for the '6', left '2' and top '3' would change to a different color (bolded in this example). This would work the same way for every other number as well, which involves overlapping classes. I've search for an answer for hours, to no avail. And here's a more "code specific" example of the table:
Code:
<table>
<tr>
<td>1</td><td>2</td><td>3</td>
</tr>
<tr>
<td>1</td><td>1</td><td>2</td><td>3</td>
</tr>
<tr>
<td>2</td><td>2</td><td>4</td><td>6</td>
</tr>
<tr>
<td>3</td><td>3</td><td>6</td><td>9</td>
</tr>
</table>
Also, the image rollover script I have goes like this:
Code:
<script type="text/javascript">
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
} .....
View 5 Replies
View Related
Sep 2, 2011
I have a simple question about calling the same function to multiple ellmenets. I guess it should be done with index.Here's my code:
Code:
$('.tab_map1 area').hover(function(){
$('#nav1').find('a').stop().toggleClass('hover', 500);
[code]...
View 6 Replies
View Related
Aug 28, 2010
I've tried to make a simple hover effect about small images but it won't work. I also tried to make the following script: 2 seconds after page loading image1 changes 2 seconds after that image1 returns to back state and image2 changes and etc.
<html>
<head>
<style type="text/css">
#as:hover{
background-image: url(images/numr.png);
} #ad:hover {
background-image: url(images/numr.png);
}#af:hover{
background-image: url(images/numr.png);
}
</style>
</head>
<body>
<input type="image" src="images/num1.png" id="as">
<input type="image" src="images/num2.png" id="ad">
<input type="image" src="images/num3.png" id="af">
</body>
</html>
View 1 Replies
View Related
Apr 21, 2010
I have a grid that uses RowAltRow as the classes for the rows...is there a way to have the hover applied to both instead of having to define it twice (or more)?
[Code]...
View 2 Replies
View Related
Oct 14, 2010
I have been trying to do some tooltips for a website and desperately wanted to learn something new and do that with jQuery.However, every time a mouse hovers over a tooltip, all hidden divs are shown, not just the one that supposed to. Here's my html:
Code HTML4Strict:
<div class="tip">
<a href="#"></a>[code].....
View 2 Replies
View Related
Nov 20, 2005
I need when a page is accessed to launch 2 popups then close itself. Can anyone help? All help is very much appreciated. One popup is going to be a regular page and an add then for other popup if any ones curious.
View 1 Replies
View Related
Jul 23, 2005
Just wondering, if one provides/uses a certificate on the website, does that
solve the problem with blocked popups?
I am building an application in PHP/JavaScript that will be used only on our
clients' computers, but new clients are added frequently.....
View 2 Replies
View Related
Jul 23, 2005
I am using a popup window to show pictures. Each time the user clicks on
a thumbnail in the mail HTML page, the popup either appears or reloads a
new picture.
Some pictures are portrait, and some are landscape. I build the popup
html dynamically. How can I a) resize the popup window to fit the image,
and b) pop it to the forefront once the new picture is loaded?
View 8 Replies
View Related
Dec 11, 2006
I am trying to get a fairly complex database form set up..at various
stages I need to open popups to edit subsections, then close them..
Now this all works fine from the main screen, I can open a popup using
window.open() and it spawns in a new browser or tab, do my stuff, and
exit to the main screen..
However if I try to open another popup in the child popup, and return to
THAT with a window close in the grandchild, firstly it never opens in a
new window, but in the child window, and secondly it closes itself and
returns not to the child window but to the parent window.
I have googled till I am blue in the face but no joy..no one seems to
have a snap solution for this one.
I suspect I need to use the window object that window.open returns,,but
have no idea how..?
View 2 Replies
View Related
Nov 17, 2006
On my site, I would like to open a centred pop-up with thumbnails. Clicking on them you get the full image with navigation arrows leading to new photos, etc.
I want to have pop-up dimensions suited to what's in the page and if the photo is vertical or horizontal.
Now, the code here under works well with FF2.0 and NS 8.0, but IE6 and Opera 9 just make the window.close() in func_aperta() and closes the pop-up.
What's wrong? Any ideas? Code:
View 5 Replies
View Related
Oct 21, 2011
For some reason, in IE8, on product pages (Example) of my ecommerce site, the 'Size Chart' and 'Email to a Friend' popups don't work, and the product image lightbox won't work eitherbrowser I have tested in, including IE7. It seems to only be IE8 that is having this problem.Upon looking at the page source, one thing I have noticed that both the 'Size Chart' and 'Email to a Friend' buttons have in common, is that the popups seem (I'm far from an expert) to be 'triggered' by a span element (class="more") within the HTML. For example:
<div class="row ">
<label >Size: </label>
<strong class="fl"><select name="size" id="size" onchange="checkstock(this.value)"><option
[code]....
View 6 Replies
View Related
Feb 25, 2004
I have a quick question about javascript popups...
At the moment I have the function
function openWindow(page,width,height)
{
window.open(page,"my_new_window","toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width=" + width + ", height=" + height)
}
Which is opened by the link
<a href="java_script_:;" onClick="openWindow('popups/popup_template.htm',駼',高')">
This works fine and I get the popup just how I want it.
However, When that popup loses focus (IE the user clicks on another page) that popup goes behind all the other open pages. Then If I open another popup with that one still open it stays in the background.
I know that I can use
Onclick="self.close()" and OnBLUR="self.close()"
to close the popup when the user clicks, but I need them to be able to click in the popup.
Does anyone know an OnLoad fucttion or method that will bring the popup to the front when the user opens another window.
OR
Is there a better way of doing this.
View 2 Replies
View Related
Jan 14, 2005
There is a webpage (of another website) "page A" (a registration form) that I have to use as a popunder on my website.
However, due to the code for the form validation (email & other entries) on Page A, the page does NOT remain as a popunder, but popups above my actual website's main page....
Is it because of this attribute in the body tag?
<body OnLoad="document.form1.email.focus();">
If so, what counter can I use to beat it poping up above the main index page?
PS: Cannot make changes to PAGE A, just my own Index page....
View 19 Replies
View Related
Jun 10, 2006
I have noticed some websites use a popup system for confirmation... I know that hotmail uses a similar feature for adding file attachments. So I was wondering how exactly a website would have that feature work.
What I need to know is how to make a popup that...
a) Popups up in the middle of the screen and ALWAYS popups up (the popup blocker in IE wont disable it)
b) A Popup window that cannot be ignored. Therefore the user cannot complete any other actions on the webpage (the page that is displayed on that particular browser instance window). If the user attempts to click outside of the box then it will not allow them to.
c) Once the popup window has been completed (the user clicked the ok button to confirm the message) then the window will disapear and the user will be focussed back onto the original window where he/she was browsing on.
Most of the stuff is simple javascript. (opener.focus() and self.close()) but when it comes down to making popups be the center of control, I am lost.
View 3 Replies
View Related
Jul 19, 2006
I'm doing a website at the moment for a shooting club which is opening in a few weeks time. I'd like to have a popup on the home page which appears on a user's first visit to tell them about the opening day. I have the cookie sorted to detect whether they've visited before or not, but how do I make a popup which won't get blocked by all today's browsers and popup blockers? Is there a way that genuine useful popups can be verified and not blocked?
View 2 Replies
View Related
Apr 27, 2011
I have a Jscript popup which comes after 5-6 seconds of my page load.
This happens for all the pages.
I have tried the following..
This load the popup on load.
Now, i want to make sure that if a user once clicks on cancel, he will not get the popup for rest of the pages also.
But if he opens the pages individually the next time, he will get the pop ups.
So it will be displayed only once after he clicks close and will not come the next time.
View 1 Replies
View Related
Jul 20, 2005
Does anyone know where I can get a script for a pop-up where I can control fixed positioning of a popup based on browser resolution?
two res's: 800 x 600 and 1024 x 768 ....
View 2 Replies
View Related
Apr 17, 2009
I have a customer that wants to have a map (jpg/gif/png) showing the US States and when you click on a state a popup will display a text box listing cities they have offices in. The cities will be links to other web pages. how to do this?
View 2 Replies
View Related
