Forum Moderators: open

Message Too Old, No Replies

jQuery swipeleft not doing anything

         

csdude55

10:56 am on Feb 4, 2016 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



I'm a little confused on why this isn't working, so I'm hoping you guys can tell me if I've made a syntax error somewhere. This is my first real foray in to jQuery.


<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquerymobile/1.4.5/jquery.mobile.min.js"></script>

<script>
$("#body_con").on("swipeleft", function() {
$('#body_con').css('background', '#FFF');
});
</script>


I added jquery.mobile because I wasn't sure if I needed it for this function.

In the body, <div id="body_con"></div> is a container that surrounds everything after <body> and before the footer tags, so swiping left pretty much anywhere on the screen should call the function.

But when I use it, nothing happens. I've tried changing the CSS to an alert for testing, too, but nothing happens.

Any suggestions on what's breaking?

csdude55

4:58 am on Feb 5, 2016 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



For the posterity, I found what (I think) is the solution. I changed the script to:


<script>
$(function() {
$("#body_con").on("swipeleft", function() {
$('#body_con').css({'background-color': '#FFF'});
});
});
</script>


Using "background" didn't work, I had to use "background-color". And I had to wrap the whole thing in $(function(){ ... });, which honestly doesn't make a lot of sense to me (I have to call a function within a function?), but it worked.

And as far as I can tell, I did have to use jquery.mobile :-(