I am working ot his project:
www.eltotaldesign.com/planeteco
I have the modules dj image slider, and another named altra switcher.
I tried to install Easy Jquery, and other methods, but nothing helps.
It's 100% problem with jquery and mootols conflict, but I cannot resolve it.
It's there any scripts to resolve this ?
Thanks!
To solve those compatibility issues you can try:
Always load Mootools before Jquery
Always load and use Jquery noconflict
Make sure you load those libraries just once per page
Don't load any of them if you aren't going to use it
Be careful with joomla cache and when combining js files
Use carefully any extension that gives you some control on js libraries:
http://extensions.joomla.org/extensions/site-management/site-performance
http://www.joomlabamboo.com/joomla-extensions/jb-library-plugin-a-free-joomla-jquery-plugin
Do you need mootools on the front end of your joomla install?
If not remove it! It will save your visitor from having to load two libs to view your site:
http://magazine.joomla.org/issues/Issue-Feb-2011/item/349-removing-mootools
If you require both make sure any mootools is using the preferred document.id instead of $ as well as setting jquery in noConflict mode.
Hope this helps! Post back the results.
When you need to use more than one javascript library for extended functionality. Two most popular libraries are mootools and jquery. They conflict because mootools is a prototype and jquery is not. But there is a simple technique to fix this. you can use them both without a conflict.
You just need to take 2 precautions.
Add jquery in no conflict mode. It ensures that more than one jquery library can be used simultaneously.
jQuery.noConflict();
Include all your jquery code as below
(function($){
//jquery code goes here.
})(jQuery);
See the complete code.
//no conflict jquery
jQuery.noConflict();
(function($) {
//jquery code goes here.
})(jQuery);
Related
I have a client who had a very complex jQuery app custom built by a previous developer within his WordPress site. Its functionality is cleanly broken out into several scripts which get minified together with the libraries they depend on. The libraries rely on an old version of jQuery (3.3.1). The site is complex and we need to be able to use the current version of jQuery to allow other plugins we're using to continue to keep up with upgrades.
The libraries include c. 2018 versions of:
Select2
Isotope
SpriteSpin
EasyResponsiveTabs
ImagesUploaded
jQuery Viewport
Some of these are minified/uglified.
I've used best practices to load jQuery 3.3.1 into a variable jQuery3_3_1 with noconflict();
It's rather easy to change standard jQuery to use jQuery3_3_1. But I need a way to force the libraries to use jQuery3_3_1, otherwise they are not recognized by the scripts (and some of them will have issues using a different version of jQuery than they were built in). Most of these use requireJs(), and I've seen instructions for setting up requirejs.config() code in the footer that will define "jquery" to be a particular version. Doing this would be a great solution, but I have no idea how to get these uglified scripts to use it.
I've read through several similar inquiries, but none have addressed forcing a jQuery version on minified/uglified code. Others speak to a level of expertise in jQuery module development that I don't have and don't have time to scale into.
Is there a way to get all these modules that use require('jquery') to have that reference jQuery3_3_1? I'd love it if there were a way to say, "For all the files that live in this directory, jQuery/jquery (there are 2 ways it is called) means jQuery3_3_1/jquery3.3.1".
Or being that it's a Wordpress site, could this be defined in the wp_enqueue_script() call?
Many thanks for your help!
For a website with live "edit-in-place", first I get the jQuery library from the fastest CDN for free ...
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
... and on top of that I need the Jeditable plugin, listed in the jQuery repository at jQuery on this page!
Is this plugin also hosted on Jquery CDN?
If not, whats the use of jQuery having a plugin in the repository without hosting the script?
In other words whats the use of a plugin repository?
How to load a script directly from jQuery repository?
<script src="................................../jeditable.js"></script>
http://www.appelsiini.net/projects/jeditable
http://www.appelsiini.net/projects/jeditable/default.html
https://github.com/tuupola/jquery_jeditable
I'm mostly using cdnjs for common js things.
A search for jeditable.js gives you the link and the script tag for easy copy-pastin'.
<script src="https://cdnjs.cloudflare.com/ajax/libs/jeditable.js/1.7.3/jeditable.min.js"></script>
Plugins are most likely not hosted on jquery CDN, because they are most likely not written by the people behind jquery.
Discoverability? Don't know how their plugin listing works, but may have been from users submitting their plugins for example. Actually hosting the plugins would add another level of unnecessary complexity. Especially if the goal is discoverability, i.e. an easy place for jquery new-comers to see what else might be possible.
I don't know how "cloudflare one day hosts something and otherday it doesnt work without notice". At least not with cdnjs, which has always worked for me. But if you're worried, just download the script and host it yourself instead...
I read a post answer that you can do search for the code I need from an old version of jQuery and copy it and paste it into a newer version jQuery script. This way I don't have to try and have two versions of jQuery to load at the same time which was unsuccessful. Both the jQuery scripts I have are .min
How do I do this? See the person's answer below
Why would you need two jQuery libraries anyway?! Just use the newer one! ... Let's even say you needed the old one because you need some functions that aren't available in the new framework. Just look them up in search mode and copy past them one by one to the new framework (can only be done if you use jQuery offline like me, which saves loading time during developpement cause it gets cached.) P.S: I hope this doesn't cause any copyrights infrigments.
Editing jquery is very bad practice, do it only for very small projects which maintenance won't have any work with jquery or component updates at all!
Better try using Jquery Noconflict library.
I have a problem with integrating my header and footer in whmcs. Everything works perfectly. Although a strange problem came along. It has something to do with the jquery.js file in my custom layout.
when I comment out the jquery.js in my footer.tpl the dropdown menu in the header does not work on pages where whmcs generates tables. (invoices and domains)
But when I do use that jquery file the tables are still generated fine and the menus work, but then I can't order domains.
No button or text fields appear when ordering a domain.
I know this is not a good and a vague question but this has got me puzzled for quit a while now.
Anyone with who can push me in the right direction to find a solution? Or someone with a similar experience with whmcs integration?
thanks in advance!!
Not sure if you found a solution on this, but likely the culprit is one of two things:
1) The jquery library loading second is clobbering the first one so it no longer exists. To fix this you should call jQuery.noConflict(); prior to loading the second jquery library, this way the $ shortcut gets pushed over to use jQuery and frees up the $ for the new jquery. This however may become a problem if any of the javascript relies on the $ shortcut and must point to the first jQuery library, in which case all shortcuts should be renamed to jQuery.
2) The scripts executing the later jQuery library aren't compatible. This can be problematic if the versions are very different as some methods and capabilities have changed over time.
Best thing to do is always to use only one jQuery library, and use the newest one if possible. Older scripts that rely on the older jQuery should be updated if possible.
I have this file from the theme of my Magento store:
http://www.princessly.com/js/jquery/jquery-1.4.2.min.js
And someone (the theme was bought) added one extra line of code at the end of it:
jQuery.noConflict();
This javascript file is used on every page of my store: a product page.
My question is, what does that line do there? What does it mean?
I wanted to use the Google hosted version but as it doesn't have jQuery.noConflict(); at the end, I thought it might not be appropriate for my site because jQuery.noConflict(); may be needed. But I don't know why it's needed. Or is it?
Can I safely change http://www.princessly.com/js/jquery/jquery-1.4.2.min.js to a Google hosted version?
Can some one enlighten me on this, please? Thanks a lot!
Currently, you will require noConflict mode in order to run jQuery in a Magento installation (because it ships with Prototype). This doesn't necessarily mean you can't use the Google CDN version though. You just need to make sure you add your own JavaScript file that get's loaded after, but before prototype, that will set noConflict.
Not exactly helpful to you now, but Magento 2 will use jQuery rather than Prototype.
It tell's the jQuery lib to remove all jQuery variables from the global scope. That way you can use it alongside another library which depends on the $ for example (without conflict). Another such library might be prototype.js. If you're is exclusively using jQuery and your local javascript isn't reassigning $ then your ok to remove that line.