Here’s one that I can’t figure out. Still very much a beginner, so go easy on me…
The example page is: http://shipkifarm.com/dev/contact
What I have at the moment is 8 images generated by WordPress Custom Fields; 4 thumbnails and their corresponding images. The 4 bigger images are all positioned absolutely so they sit on top of each other. The 4 thumbnails are just below and are floated <li>’s. When I click on the thumbnail, I want to add the class of "current", which sets the opacity of the image to 1.0, and remove the class of "current" from the currently visible image, which sets the opacity to 0.0.
What I’d like to do is remotely link the thumbnails (each of which have an anchor tag) to their corresponding images. Each set of 4 images is in its own <ul>.
The jQuery that I’m trying to work out is:
var jQueryImageRel = jQuery(“#contactImage li img”).find(jQueryThumbRel);
The part that doesn’t work is the jQueryImageRel returns [object] [Object] when alerted. One more detail is that I’m using the rel’s of the thumbnails to match to the id’s of the images.
What am I missing?
Here’s the generated HTML:
and the css:
Here’s what was figured out (with a bit of help):
$(“#contactImage li img”).css(‘opacity’, ‘0.0’);
$(“#contactImage li img:eq(” + jQueryThumbRel + “)”).css(‘opacity’, ‘1.0’);
You must be logged in to reply to this topic.