JS creating a conflict with WP for a slideshow - javascript

I'm getting an issue with a javascript slideshow that I wish to embed in a WP header.
Here is the slideshow designed and ready to use: http://coachjoelleinc.com/wp-content/themes/32950/rotator/test.html
And this is where I want to embed it: http://coachjoelleinc.com/index_real.php/
In older versions of Firefox it disables other plugins, such as the navigation.
Any advice would be much appreciated.

It's looking fine in Chrome for me but the issues with older browsers might be caused by the fact you've loaded the jQuery library twice. Wordpress is loading the version that came with it (1.7.2) but prior to that version 1.5.1 is being loaded - probably by your theme's header.php rather than a plugin, the file is in the themes directory.
Bear in mind you have to load jQuery before you load all the scripts that rely on it, so if you remove the older version which is being loaded first you will need to make sure the other dependant scripts load are moved so they are loaded after the newer version of the jQuery library is loaded.
There are various ways to do that - you can enqueue them in functions.php, or move those scripts into the footer. A quick Google comes up the Codex Javascript guide along with some examples of including JS in Wordpress

Related

jQuery versions overlapping issue

i'm working on a widget, that needs jQuery complete version and jQuery UI to work.(This widget should be able to be embedded in any website)
It works fine and like expected when i embed it in my project. But sometimes when i embed it in other project that has another JQuery library it brakes the code of my widget.
For instance, if the website has another jQuery version, i can check if(typeof jQuery == 'undefined') and don't use another version and ti works fine only if the defined version is a complete one, otherwise it won't work because it needs the complete version of jQuery.
Or if i use jQuery.noConflict(true), it removed any other defined version and the widget works fine but sometimes it breaks the website (where the widget is embedded) because in this case jQuery is loaded at the end and any scripts that depends on it won't work.
I'm struggling with this issues for many days cause the widget needs to work fine where ever it's embedded and must not affect the host website. Any help please?

how to stop clash between jquery and protoype on this page

This page is a combination of magento and a wordpress theme. Unfortunately the jquery is causing the protoype not to work but I'm not to amazing at using developer tools to locate these kinds of problems.
My understanding is that I need to run jquery in noConflict mode but I can't find where it is called from the wordpress theme.
Can anyone advise how I can locate this or solve the problem.
http://www.findcarpettiles.co.uk/wp/general-information/free-samples-measurement/
Thanks
jQuery is included and ran in noConflict mode automatically. I believe your problem is that you include two versions of jQuery (one from Magento and one from WP). If I were you, I would add the following to your functions.php to stop WP from including its version of jQuery.
add_filter( 'wp_default_scripts', 'change_default_jquery' );
function change_default_jquery( &$scripts){
if(!is_admin()){
$scripts->remove( 'jquery');
}
}

Integrating Isotope js on Joomla 1.5 site

I am trying to integrate Isotope JS on Joomla 1.5 site. (I know it's old Joomla!)
https://www.buffalobrownies.com/?view=article&id=269
I got the code working fine on a test page on that domain (but outside of Joomla).
Inside Joomla, neither the JQuery nor vanilla JS seems to trigger.
With JQuery trigger code on, I get this error on Chrome Console:
Cannot read property 'isotope' of null
(With the vanilla JS script turned on I get a bunch of OTHER errors......)
So I'm guessing there is something wrong with the reference to $ but I'm not clued up enough to know what it is...
Any thoughts out there? Thanks for your help
(I have Jquery linked high up in the <head>, then Isotope JS link just after, then the isotope trigger JS before the bottom </body> tag)
Chris
So I discovered that it was Mootools in Joomla 1.5 that was causing the conflict.
(I just had to start taking lines of code out, one by one, until I found the one that made the difference).
I managed to find some code online that turned Mootools off for the front end, but kept it on for the back end.
Now I've managed to get the Isotope script working in my example. Now I just need to get it working with live data!

Nivo Slider not working with wordpress

All of a sudden the nivo slider on one of our clients websites is not showing up at all: www.bedehouse.org
I have tried all sorts but cannot see why its stopped all of a sudden? We have not done any updates to wordpress or any of its plugins recently.
I can see using chromes "inpect element" feature that there is an error: "Uncaught TypeError: $(...).nivoSlider is not a function" but have no idea what it means.
Any helps or pointers in the right direction would be massively helpful.
You're loading two versions of jQuery. One is the copy WordPress is loading and the second is another.
Both are different versions (WP is loading 1.8.3 and you're loading 1.8.2). WordPress loads jQuery in noconflict mode and does not allow the use of the $ shortcut.
Remove the jQuery 1.8.2 call that you made and change all instances of $ to jQuery and try it.

What causes page load delay after jquery loaded by Chrome?

What causes the delay after jquery.js is loaded? and after jquery-ui-*.js as well? This is very consistant. As you can see, all resources except the PHP file are loaded from cache -- this makes me believe it may be that Chrome is doing its V8 magic on them?
Interestingly, it doesn't occur with the bootstrap-*.js files. Maybe they're much smaller?
jquery is a dependency of jquery-ui. Basically, jquery-ui can't be loaded until jquery is finished.

Categories

Resources