Please help with JavaScript om is based on JQuery?

Hi all. Please help with JavaScript om is based on JQuery. The script adds a class when you Swipe and does not handle the toggle.
For three days I on the menu and fell case, to test the script. What the $ function or even that you do not set the function to Swipe. For earlier, thanks. I would be very grateful.
But the cm script.
$(document).ready(function() {
 $("[data-toggle]").click(function() {
 var toggle_el = $(this).data("toggle");
$(toggle_el).toggleClass("open-menubar");
});
$(".swipe-area").swipe({
 swipeStatus: function(event, phase, direction, distance, duration, fingers) {
 if (phase == "move" && direction == "right") {
$(".menubar").addClass("open-menubar");
 return false;
}
 if (phase == "move" && direction == "left") {
$(".menubar").removeClass("open menubar");
 return false;
}
}
});
});

With crypts taken from here www.dejurka.ru/css/swipeable-side-menu
And here it generally a perversion. www.sitehere.ru/sozdanie-vydvigayushhegosya-menyu
And here you can see my example at work. jsfiddle.net/hLh419gk
July 2nd 19 at 18:23
2 answers
July 2nd 19 at 18:25
Maybe jQuery loaded in compatibility mode, try this:
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>

the <script>
(function($) {
 $('body').on('swipeleft', mySwipeLeft);
 $('body').on('swiperight', mySwipeRight);

 mySwipeLeft function(event) {
 // code for left swipe
}

 mySwipeRight function(event) {
 // code for right swipe
}
})(jQuery);

</script>
Thanks, helped to work out the Toggle, but Swipe still gives an error Uncaught TypeError: $(...).swipe is not a function - nikita.Stracke commented on July 2nd 19 at 18:28
Try instead swipeStatus: function(event, phase, direction, distance, duration, fingers) to use a var swipeStatus = function(event, phase, direction, distance, duration, fingers) - tate_Stracke78 commented on July 2nd 19 at 18:31
: It turns out the syntax error in this line. - nikita.Stracke commented on July 2nd 19 at 18:34
: Can you suggest why a swipe to the left not fulfilled, and swipe to the right, even for a simple Tapa is fulfilled?
$("body").swipe({
swipeStatus:function(event, phase, direction, distance, duration, fingers)
{
if (phase!="move" && direction!="right") {
$(".menubar").addClass("open-menubar");
return false;
}
if (phase!="move" && direction!="left") {
$(".menubar").removeClass("open menubar");
return false;
}
}
}); - nikita.Stracke commented on July 2nd 19 at 18:37
Try this:
- tate_Stracke78 commented on July 2nd 19 at 18:40
code is not inserted, the answer now will edit - tate_Stracke78 commented on July 2nd 19 at 18:43
: Okay, thank you, waiting. - nikita.Stracke commented on July 2nd 19 at 18:46
Your option is not working.
(function($) {
$('body').on('swiperight', mySwipeRight);
$('body').on('swipeleft', mySwipeLeft);

mySwipeRight function(event) {
if (event!='move' && direction!='right') {
$('.menubar').addClass('open-menubar');
return false;
}
}
mySwipeLeft function(event) {
if (event!='move' && direction!='left') {
$('.menubar').removeClass('open-menubar');
return false;
}
}
})(jQuery);

Not so.

(function($) {
$('body').on('swiperight', mySwipeRight);
$('body').on('swipeleft', mySwipeLeft);

mySwipeRight function(event) {
$('.menubar').addClass('open-menubar');
}
mySwipeLeft function(event) {
$('.menubar').removeClass('open-menubar');
}
})(jQuery); - nikita.Stracke commented on July 2nd 19 at 18:49
why do it here if (event!='move' && direction!='left')? - tate_Stracke78 commented on July 2nd 19 at 18:52
: Just checked and so and so, but then I realized that if (event!='move' && direction!='left' is not necessary. removed, but the swipe does not work. In my version, at least right works. - nikita.Stracke commented on July 2nd 19 at 18:55
: Again, thanks. You helped with the first part. The decision on the second part, added below. The problem was solved. - nikita.Stracke commented on July 2nd 19 at 18:58
July 2nd 19 at 18:27
Corrected according to Manu on the websitelabs.rampinteractive.co.uk/touchSwipe/demos/Swipe_...
It turned out so.
$("wrap-content").swipe({
 swipeStatus:function(event, phase, direction, distance, duration, fingers)
{
 if (phase!="move" && direction!="right") {
$(".menubar").addClass("open-menubar");
 return false;
}
 if (phase!="move" && direction!="left") {
$(".menubar").removeClass("open menubar");
 return false;
}
}
 });

But the error has gone, but he started swearing at me bootstrap.js line 16 according to which
$(context).find('.tabbable').once('bootstrap-tabs', function () {

and the error message Uncaught TypeError: $(...).find(...).once is not a function

And so! The problem was resolved and everything works great!
In fact, as it turned out, you can't swipe nanachat on if inside, already worked through the script for the opening and closing of, in my case the data-toggle. And I started digging in the direction of the swipe script. And for the correct interpretation of the documentation at the link above, he began to edit the script that is specified above. Thus, he got himself even further into the jungle. It turned out that simple.
jQuery(document).ready(function($) {
 $('[data-toggle]').click(function() {
 var toggle_el = $(this).data('toggle');
$(toggle_el).toggleClass('open-menubar');
});
$("#wrap-content").swipe({
 swipeStatus:function(event, phase, direction, distance, duration, fingers){
 if (phase=="move" && direction=="right") {
$(".menubar").addClass("open-menubar");
 return false;
}
 if (phase=="move" && direction=="left") {
$(".menubar").removeClass("open menubar");
 return false;
}
}
});
});

With the help of Dmitry, the First part of the script started to work, and in the second part, it was necessary only to specify the correct region where you should test the script to remove unnecessary gaps and before use, clean the browser cache.
PS: the Script can not work when applied to the unit, so it is better to wrap the block in DEVCO, assign a class for example "menubar" and this wrapper to use this script.
All, thank you. Do not judge strictly, for the rough description. Write to the best of its knowledge.

Find more questions by tags JavaScriptjQuery