how to use/call this function in javascript/jquery?

Question

im very new to jquery/javascript. So here goes, I found this js code for swipedown and swipeup. But don't know how to use it or call it.

The js code:

   (function() {
 // initializes touch and scroll events
    var supportTouch = $.support.touch,
            scrollEvent = "touchmove scroll",
            touchStartEvent = supportTouch ? "touchstart" : "mousedown",
            touchStopEvent = supportTouch ? "touchend" : "mouseup",
            touchMoveEvent = supportTouch ? "touchmove" : "mousemove";

// handles swipeup and swipedown
    $.event.special.swipeupdown = {
        setup: function() {
            var thisObject = this;
            var $this = $(thisObject);

            $this.bind(touchStartEvent, function(event) {
                var data = event.originalEvent.touches ?
                        event.originalEvent.touches[ 0 ] :
                        event,
                        start = {
                            time: (new Date).getTime(),
                            coords: [ data.pageX, data.pageY ],
                            origin: $(event.target)
                        },
                        stop;

                function moveHandler(event) {
                    if (!start) {
                        return;
                    }

                    var data = event.originalEvent.touches ?
                            event.originalEvent.touches[ 0 ] :
                            event;
                    stop = {
                        time: (new Date).getTime(),
                        coords: [ data.pageX, data.pageY ]
                    };

                    // prevent scrolling
                    if (Math.abs(start.coords[1] - stop.coords[1]) > 10) {
                        event.preventDefault();
                    }
                }

                $this
                        .bind(touchMoveEvent, moveHandler)
                        .one(touchStopEvent, function(event) {
                    $this.unbind(touchMoveEvent, moveHandler);
                    if (start && stop) {
                        if (stop.time - start.time < 1000 &&
                                Math.abs(start.coords[1] - stop.coords[1]) > 30 &&
                                Math.abs(start.coords[0] - stop.coords[0]) < 75) {
                            start.origin
                                    .trigger("swipeupdown")
                                    .trigger(start.coords[1] > stop.coords[1] ? "swipeup" : "swipedown");
                        }
                    }
                    start = stop = undefined;
                });
            });
        }
    };

//Adds the events to the jQuery events special collection
    $.each({
        swipedown: "swipeupdown",
        swipeup: "swipeupdown"
    }, function(event, sourceEvent){
        $.event.special[event] = {
            setup: function(){
                $(this).bind(sourceEvent, $.noop);
            }
        };
    });

})();

this is the anchor element that I want to trigger using the above code

<a href="<?php echo base_url();?>home/drop_down" id="swipedown"></a>

tried call the function like this:

$('#swipedown').live('swipedown', function(event, data){
                    alert('swipes')
            });

but it didn't prompt me the alert. >.<. Any help will be much appreciated.

The code is self-executing. It means that as soon as the script is loaded, this function will get executed. And it is adding swipeupdown events to the jQuery collection of events. — Zlatko
– Zlatko, Commented Feb 17, 2012 at 9:08
@scott i didn't found any documentation and here is the link: snipt.net/blackdynamo/… — Wondering Coder
– Wondering Coder, Commented Feb 17, 2012 at 9:16
@zladuric how do i call it? or use it? really dont know how to do it. — Wondering Coder
– Wondering Coder, Commented Feb 17, 2012 at 9:22
Hmm, not really into jQuery. But if it is listening to swipeupdown events, maybe you can try firing them manually somewhere down the timeline to test?, like $("#someid").trigger("swipeupdown");? — Zlatko
– Zlatko, Commented Feb 17, 2012 at 11:11

Schiavini · Accepted Answer · 2012-02-17 09:04:47Z

1

The last () are calling the funcion after it's created. The funcion adds a new possibility to jquery. So you can probably call it doing:

$('#swipedown').bind('swipedown', function(e){
    alert('test');
});

answered Feb 17, 2012 at 9:04

Schiavini

2,9492 gold badges27 silver badges50 bronze badges

Sign up to request clarification or add additional context in comments.

6 Comments

Wondering Coder Over a year ago

tried your code but still no response but when I'm binding it to a click event it triggers the alert. this is very frustrating.

Schiavini Over a year ago

you can also try to add an alert after setup: function() {, so at least you know whether the event is being bond but doesn't work, or the event is not being bond at all.

Wondering Coder Over a year ago

tried adding alert inside the js function and it did prompt me so it's really loading the js file but still i'm unable to use it/ call it. grrr. What do you mean by $(window)? Are you implying to this: $(window).bind('swipedown', function(e){.... ?

Schiavini Over a year ago

Yes, that's what I meant. But if the setup function is being called, it means the plugin should work. Maybe it's just not a good plugin. You can either search for another one, or try to fix this..

Wondering Coder Over a year ago

i'm looking for a javascript/jquery script that will handle a swipedown like in the native app of IOS or android. Have you already encounter like this?

|

Kal · Accepted Answer · 2014-01-28 19:23:02Z

0

Your code will be added (as documented) to the jQuery events special collection this means that you could call swipeup or swipedown as any other jQuery event.

example:

$("div p").live('swipedown',function() {
  alert("swiped down");
});

That will be triggered on a swipedown action happening to a p element like:

<body>
 <div>
  <h1>hello world</h1>
  <p>pull me down</p>
 </div>
</body>

answered Jan 28, 2014 at 19:23

Kal

98818 silver badges30 bronze badges

Collectives™ on Stack Overflow

how to use/call this function in javascript/jquery?

2 Answers 2

6 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related