• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 293
  • Last Modified:

click a button - jquery

in my page have a jquery lightbox, colorbox.

So it plays a slideshow and we can group pictures using "rel". So i have group of images and images have links to high res images, these images have the same "rel" and when click on an image slideshow starts.

But the problem is slideshow only starts if user click on a small image which has the <a rel="group">

I want to start the slideshow from a separate button. so what I did is I set something like this.

$("a[rel='albumSlideshow']").colorbox(
										{
											transition:"fade", 
											slideshow:true, 
											slideshowAuto: true,
											maxWidth: '80%',
											initialWidth: '80%',
											scalePhotos: true
											
										})
								$(".albumSlideshow").click(function(){
									$("a[rel='albumSlideshow]").click();
								})

Open in new window


So I've configured the lightbox with a slideshow and the button is "albumSlideshow" so when user click that button a[rel='albumSlideshow]' also get clicked, the problem is page has lots of a[rel='albumSlideshow] so it screws up the slideshow.

What I wants to do is, click only one a[rel='albumSlideshow]. Well I can assign an ID to one of this links and set it to be clicked, but this is a dynamic site.

Hope it make sence

<a rel="group" href="real_img.jpg">Small image here</a>
0
sahanz
Asked:
sahanz
  • 2
1 Solution
 
jhp333Commented:
You need to find a relationship between the button and the <a>.
For example, if the button and <a> are siblings, i.e. have a common direct parent, you can do:

$(".albumSlideshow").click(function(){
  $(this).siblings("a[rel='albumSlideshow]").click();
});

Or if they have a common ancestor div, you can do:

$(".albumSlideshow").click(function(){
  $(this).parents('div:first').find("a[rel='albumSlideshow]").click();
});
0
 
jhp333Commented:
Or if the <a> is one of the follow siblings of the button:

$(".albumSlideshow").click(function(){
  $(this).nextAll("a[rel='albumSlideshow]:first").click();
});
0
 
KiasChaos83Commented:
Using jQuery it's fairly easy. You would use the trigger() method. E.g.

$("a[rel='albumSlideshow]").trigger("click");

And that will trigger the javascript in the Click event.
0
 
sahanzAuthor Commented:
Thanks a lot,
Tried this

$(".albumSlideshow").click(function(){
  $("a[rel='albumSlideshow']:first").click();
});
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: Python 3 Fundamentals

This course will teach participants about installing and configuring Python, syntax, importing, statements, types, strings, booleans, files, lists, tuples, comprehensions, functions, and classes.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now