2

I have this piece of code, and I need to target only the first click for one line and normal clicks for the rest.

$esCarousel.show().elastislide({
    imageW  : 240,
    onClick : function( $item ) {
        if( anim ) return false;
        anim    = true;
        // only in the FIRST CLICK click show wrapper (expected but don't work)
        _addImageWrapper();
        // on click show image
        _showImage($item);
        // change current
        current = $item.index();
    }
});

When i click the item, everything works great, but when I click again I need only the “$_showImage($item);” and not the “_addImageWrapper();”.

Can you help me? I'm really a newbie about js :(

UPDATE: When I close (close with fadeOut) It won't open again! It must be because the carousel is already been clicked… how can I “reset” the click?

$navClose.on('click.rgGallery', function( event ) {
    $('.rg-image-wrapper').fadeOut('2000');
    return false;
});

Thanks for the help, I'm learning this (I think :x)!

1
  • regarding elastislide() -- does it matter? We can clearly see the part that should be triggered only for the first click. It doesn't matter if it's nested inside a function called "superwhatchamacallit". Would also be curious about why the downvote. A newbie is asking a question, and the answer will teach him how to track a flag. Not downvote-worthy. Commented Feb 17, 2012 at 23:33

3 Answers 3

8

You could set a variable outside this code:

var clickedCarousel = false;

$esCarousel.show().elastislide({
    imageW  : 240,
    onClick : function( $item ) {
        if( anim ) return false;
        anim    = true;
        // only in the FIRST CLICK click show wrapper (expected but don't work)
        if(!clickedCarousel) {
          _addImageWrapper();
          clickedCarousel = true;
        }
        // on click show image
        _showImage($item);
        // change current
        current = $item.index();
    }
});

Does this fit your need?

UPDATE: Regarding this update:

UPDATE: When I close (close with fadeOut) It won't open again! It must be because the carousel is already been clicked… how can I “reset” the click?

fadeOut() takes a callback of this form:

obj.fadeOut( [duration] [, callback] )

callback can be an inline function or a predefined one, so you could use this (inline):

$navClose.on('click.rgGallery', function( event ) {
    $('.rg-image-wrapper').fadeOut(2000,function(){
       clickedCarousel = false; // reset to false after fade out is complete
    });
    return false;
});

Does that help?

5
  • Edit provided for the reset query
    – MyStream
    Commented Feb 18, 2012 at 0:17
  • When I click again the _addImageWrapper(); don't open. Oh, and thanks for the heads up about fadeOut()! Commented Feb 18, 2012 at 1:48
  • I'm reading something about .unbind('click') but can't make it work… maybe I have to go this way, no? Commented Feb 18, 2012 at 1:54
  • @edmundojr I don't think it's usable in your case because you're using a plugin, but you should have a look to the one method api.jquery.com/one :)
    – pomeh
    Commented May 12, 2012 at 11:13
  • @MyStream Thaaank you for flagging tip to handle clicks. +1
    – Danish
    Commented Mar 28, 2016 at 13:50
2

Wrap _addImageWrapper() in an if (!this.clicked) condition, then set this.clicked = true;

0

Add a variable to keep track of if it's already been clicked.

$(function() {
    var alreadyClicked = false;
}

$esCarousel.show().elastislide({
    imageW  : 240,
    onClick : function( $item ) {
        if( anim ) return false;
        anim    = true;
        if (!alreadyClicked) {
            alreadyClicked = true;
            _addImageWrapper();
        }
        // on click show image
        _showImage($item);
        // change current
        current = $item.index();
    }
});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.