I'd like to use this multi-level push menu in my webapplication. But the problem with this plugin is that it needs an older version of jQuery. It will crash in combination with v2.x.x of jQuery.
The owner has done this on purpose, so that older browser versions are covered with the plugin as well.
So I'd like to convert/migrate this script to make it compatible with the latest version of jQuery, the only problem is, is that jQuery isn't my 'thing' (yet). I'm not sure where to start, what to remove of what to add in the script.
My question basically is, can someone point me into the right direction to get this script working with the latest version of jQuery?
I'd really really appreciate any help!
EDIT:
UPDATED ANSWER:
Use Version2 from the Multilevel Push Menu download page! ::link:: ...
I downloaded that version, and changed from jquery-1.10.2 to jquery-2.0.3 ... and it's working perfectly! Here's a jsfiddle: jsfiddle.net/vLrp51g3
PREVIOUSLY ANSWERED
As suggested by A. Wolf, you can use migrate jquery js file to handle the older jquery version. Since the remaining plugins/scripts of your webpage might require latest jquery, you could use the getScript() function to load the migrate jquery for only the pushmenu plugin! Therefore, you should probably use the code provided below for your requirement...
$(document).ready(function(){
$.getScript( "http://code.jquery.com/jquery-migrate-1.2.1.min.js", function() {
$.getScript('js/jquery.multilevelpushmenu.min.js', function() {
$('#menu').multilevelpushmenu();
});
});
});
Related
I am using bootstrap 3 and jQuery version 1.10.2
I am also using easy commenter and they require jQuery version 1.5.2 I have tried to just keep version 1.10.2 , just keep version 1.5.2 and keep both of them. But in every case one of them does not behave as expected. With version 1.5.2 the collapsible menu in header stops working with version 1.10.2 easy commenter stops working. How should I deal with this problem?
Here is a link to the page I am working on http://8mags.com/lessons/php/phpcalendar.php
Use the newer JQuery plus the migrate plugin
The correct answer is: If the "easy commenter" plugin doesn't work with a current version of jQuery, rather than one from three years ago, you want to find a different plugin or take the existing one and modify it so that it works with the current jQuery. The differences between 1.5.2 and 1.11.2 (the current version as of this writing) aren't really all that big, and are easily updated.
If you don't want to do that (why not?), then you can use both versions of jQuery on your page, but it doubles the size of an already-large library, increasing page load time.
Here's how:
<script src="jquery-1.5.2.js"></script>
<script src="easy-commenter.js"></script>
<script>
var $old = jQuery.noConflict(true);
</script>
<script src="jquery-1.11.2.js"></script>
<!-- all your other plugins and such, including bootstrap -->
You load jQuery 1.5.2, load the easy commenter plugin, then use noConflict to release both the $ and jQuery symbols, and load jQuery 1.11.2.
When you want to use the easy commenter plugin, use $old rather than $.
I need a help in jquery camera plugin. I downloaded the plugin from
http://www.pixedelic.com/plugins/camera/
And I placed all the necessary JavaScript files downloaded from the site in the same location :
My php program is (it does not have any php scripts although the extension is .php) in the same folder as "js" This is the html code :
<script type="text/javascript" src="js/jquery/jquery-1.10.2.js"></script>
<script type='text/javascript' src='js/jqueryCamera/scripts/jquery.easing.1.3.js'></script>
<script type='text/javascript' src='js/jqueryCamera/scripts/jquery.mobile.customized.min.js'></script>
<script type='text/javascript' src='js/jqueryCamera/scripts/camera.min.js'></script>
<script>
$('#camera_wrap').camera();
</script>
<div id="SlideWrapper">
<div id="camera_wrap">
<div data-src="images/slider/01.jpg"></div>
<div data-src="images/slider/02.jpg"></div>
<div data-src="images/slider/03.jpg"></div>
</div>
</div>
And when I run the program it does not show the images. I have done exactly how its instructed in the website. I have not added any features and changed any parameters.
I have placed the program in the webserver and it can be viewed at :
http://store.touchmedia.ca/mytest/TestCamera01.php
Please help me to make it work...
thanks,
Isaac
I found the answer in the following link:
https://groups.google.com/forum/#!topic/camera-slideshow/AgVzZjjJ75Y
Looks like the newer JQuery version(s) do not support JQuery Camera slider, must be because of certain functions/APIs required for the slider were removed in the newer version as mentioned by Nouphal (Thank You).
I downloaded the fixed version from the above link and you can see that in
http://store.touchmedia.ca/mytest/TestCamera02.php
From this, I doubt how far can we trust the plugins which were developed by somebody whom we don't know, and when newer version(s) of JQuery is/are released then the plugin would stop working, imagine we develop a website for a customer and after a few months it stops working and we don't know how to fix the plugin and will end up throwing questions at all the forums found in the internet.
Call function when DOM gets ready.
Write:
$(document).ready(function(){
$('#camera_wrap').camera();
});
It seems that the problem is due to inconsistency between your plugin and the jQuery source file. In your example you are using the latest jQuery version i.e 1.10.2. You should always keep in mind that with each new version some of the older and inconsistent api's are removed and new ones are added. I think this plugin may be using some of the removed or deprecated methods. This plugin is however compatible till jQuery version 1.8.3. You can find the jQuery change log here or here. i have created a working example of your problem in JSBIN
I updated this plugin. It is now compatible with jquery-1.10.2 and bug free
Latest version as of 01/29/2014 available at: http://www.orangecountyseomarketing.com/projects/slider.html
http://www.orangecountyseomarketing.com/assets/js/slider/camera.js
BUGS FIXED:
Resolved latest jQuery version with .on() instead of .live();
Can still include iFrame with Video, extended size of video to 100%, video can play with any host not just vimeo or youtube
Working Pause and Play buttons.
Hope this helps.
-Yamenator-
I have been styling a predefined site, and after adding some box-shadows last night my loopedSlider has stopped working.
I have installed a clean version of the template I am using alongside. The page in question is
scorpionhosting.net
and the clean template is:
scorpionhosting.net/cleanhostpay
I've been back through the CSS, checked the html and w3c validated both to double check it wasn't something obvious (closing tags etc). I notice that the clean template is using loopedslider.min.js while my page is not. I don't understand why this is, I'm afraid I don't speak javascript very well yet!
The clean version has jQuery 1.3.2 loading:
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
Your new version has no jQuery.
The latest version of jQuery is 1.9.1, by the way, so I'd update for a new site. You may have trouble with your slider if you go that far, though, since 1.9 removed some deprecated methods. I'd try 1.9.1, and if it doesn't work, try 1.8.3.
I'm building a website which use Nivo Slider. At first, it worked nicely. But yesterday, when I tried again, it's suddenly stop moving. I haven't changed anything yet before I discovered this issue. I looked into the console and there is a javascript error which says:
Uncaught TypeError: Object [object Object] has no method 'live'
When I tried to look into jquery.nivo.slider.js, the error is on $('a.nivo-prevNav', slider) like below:
$('a.nivo-prevNav', slider).live('click', function(){
// function's content
});
Using google's inspect element feature, I search into the page and found there.
What is wrong with that? why it is suddenly stop moving? Any help would be appreciated.
The Nivo Slider needs jQuery to work. On your website you refer to jQuery like this
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
This is pretty dangerous, as the latest version constantly changes. As can be seen from the jQuery documentation at
http://api.jquery.com/live/
the live function is deprecated since jQuery 1.7. Looking at the unminified jQuery source at
http://code.jquery.com/jquery-latest.js
it seems like the function is not there anymore, which is why you get the error.
Solution: bind jQuery with a specific version - probably you can find out which version you need from Nivo Slider documentation. Some of the older versions of jQuery can be found here: http://jquery.com/download/
In jQuery version 1.9, which it looks like you're using, the live() function is actually deprecated: http://api.jquery.com/live/
I guess you may have to wait for Nivo to update their source to support the latest jQuery, you can go down to jQuery 1.7, or modify the Nivo source yourself.
There is now a new version of Nivo Slider (3.2) that uses .on instead of .live.
Or use an older version of jQuery (1.7.1 is working for us)
Replacing all the .live() with .on() in the nivo slider's js file worked for me. My jquery was version 1.9.1 .
I'm in need of implementing functionality equal to that of jQuery UI's Sortable method:
http://jqueryui.com/demos/sortable/
However, I'm not able to use a version of jQuery 1.3+. There is another functionality on the pages that are dependent on the older version which ceases to work when upgrading the older version of jQuery.
I need to implement this either using raw JS or an older version of jQuery. Is there a jQuery plugin or something of the like that is available to facilitate?
What are the other functionalities that cease to work?Cause I had some issues as well by upgrading to 1.3.2 earlier this week, but it came down to a certain syntax change from 1.2 to 1.3. So it was easily fixed.
For you it might of course be very much different...