You're probably right that your glossy and iradius50 "classes" are
interfering with jQuery code.
Have you tried this:
$('.glossy').click(function(){
alert('testing');
}
Concerning the xPath options that the previous poster mentioned. Let's
pretend we have a navbar (id=navigation) with multiple buttons inside it,
like so:
<div id="navigation">
<img src="images/Advanced Search Glossy_WIDE.jpg" class="glossy iradius50"
alt="" />
<img src="images/Home Glossy_WIDE.jpg" class="glossy iradius50" alt="" />
<img src="images/Contact Us Glossy_WIDE.jpg" class="glossy iradius50" alt=""
/>
</div>
Now each of those buttons has a number of ways that you can access it:
$('img') // assuming that you want all images to have the click behaviour
$('.glossy') //only images with the glossy class applied to it
$('#navigation img') //all images contained within the div with an id of
navigation
This last one might be the most useful to you, assuming that these buttons
have a parent container with a unique identifier.
-----Original Message-----
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Mitchell Waite
Sent: Friday, July 20, 2007 1:41 PM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: Click to call a fuction?
How generous of you to go into this detail and give me so many options.
Sadly I tried all of these techniques and none of them worked.
1. The mixing of the ID and class in my first example still didn't work.
2. The idea of adding the additional class xyz to the existing class didn't
work. It may be because
class="glossy iradius50"
"glossy" is a cool plugin that modifies button images so they have curved
edges and look like glass and "iradius50" is a parameter for glossy. Glossy
is just is.
3. Using an .xyz class in the div did not work either. I am not sure why.
Perhaps the two classes are interfering with each other.
I need to read more about selectors.
It may also be my project has too many bells and whistles that it's not a
true test of your ideas.
-----
Essentially, you need some way with CSS (or possibly XPath) selectors to
distinguish the elements that need your new behavior. Create a selector for
those elements and create a JQuery object from them using the "$()"
function. Then it's easy to send a behavior to the click method of this
JQuery object.
------
I have read this 10 times and I am still not sure what you are saying.
Mitch
-----Original Message-----
From: jquery-en@googlegroups.com [mailto:[EMAIL PROTECTED] On
Behalf Of Scott Sauyet
Sent: Friday, July 20, 2007 11:01 AM
To: jquery-en@googlegroups.com
Subject: [jQuery] Re: Click to call a fuction?
Goofy wrote:
> What happens if you already have some 3rd party class on the image
> like this:
>
> <img src="images/Advanced Search Glossy_WIDE.jpg" class="glossy
> iradius50" alt="" />
>
> If I add an ID the click never gets fired
>
> <img src="images/Advanced Search Glossy_WIDE.jpg" id="PanelOpenGlossy"
> class="glossy iradius50" alt="" />
It should. This
$('#PanelOpenGlossy').click(function(){
alert('testing');
}
should work.
> My other question is this: the ID has to be unique for this approach
> to work, right? You can't call the same function but have to make a
> new one. That seems inefficient as I would be repeating the same
> function for every click, only difference would be there IDs.
If you can add an additional class, e.g. class="glossy iradius50 xyz", to
all the relevant images, then you can simply change the selector above:
$('.xyz').click(function(){
alert('testing');
}
Notice the change from "#" to "."; this is the CSS way of switching from ids
to classes.
If you can't add this class, you'll need to find some other way of
distinguishing them from images that shouldn't have this functionality.
For instance if this is all the images inside any div with class
"clickable", then you might use:
$("div.clickable img").click(function() {
alert('testing');
}
Or if you need only those images inside the div with id "main" that don't
have the class "ignoreMe", you might try
$("#main img").not(".ignoreMe").click(function() {
alert('testing');
}
Essentially, you need some way with CSS (or possibly XPath) selectors to
distinguish the elements that need your new behavior. Create a selector for
those elements and create a JQuery object from them using the "$()"
function. Then it's easy to send a behavior to the click method of this
JQuery object.
Good luck,
-- Scott
