I found a "scroll to fixed" sticky navigation that I love, but I'm having trouble getting it to work at my site - http://codepen.io/Guilh/pen/JLKbn
The problem is, they are using JQuery.min - http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js and my Wordpress site is using JQuery, the same version 1.11.0, but without the min in the URL.
When I test the code out locally, the JQuery.Min link works, but not my JQuery, even though they are both 1.11.0. Is there a difference? The code in the two files looks exactly the same, but one works and the other does not. I thought min just meant minified so that it is a shorter file and faster load.
Sorry. I "need 50 reputation to comment". Have you tried seeing if $ is defined? In some CMS's they run jQuery in no conflict mode so you have to use jQuery instead of $. To find out go to your firefox console and type in $ and hit enter. Then type in jQuery and hit enter. That will tell you if it's undefined or not.
If you want to use $(function(){/*code here*/}); but still use $, you can pass it using jQuery(function($){/*code here*/});. This is all assuming you are running in noConflict() mode.
Related
I'm currently updating the website http://www.dev.optiekvandevecht.nl/, I updated it from Joomla 3.3.6 to Joomla 3.4.1. Before updating to 3.4.1, a few lightbox thigns wouldn't work. Right now, I've updated Joomla, and the lightboxes work fine, however, now the nivoSlider seems to be broken (and I suppose it's got to do with jQuery errors, .nivoSlider is not a function.
I honestly don't see what is wrong, it's a Joomla module called ARI Image Slider, but I can't find anything related to the issues I run into.
I deleted an (apparently) unused extension and the problem was solved
It seems like the jquery is already included in any of the extension. Try disabling jquery in any one extension then check it. I hope it would work.
I am working on a site where I am using Scott Robbins pageslide to show/hide a responsive navigation.
For some reason the pageslide navigation works fine on the rest of the site but, when it gets to the contact page, it breaks: http://kevinpresbrey.com/contact
I took a look at the console in Chrome and I'm getting this error:
Object [object Object] has no method
I updated the jQuery call for pageside from this:
$(".open").pageslide({ direction: "right"});
To this:
jQuery(".open").pageslide({ direction: "right"});
and it's still blowing the error and causing the pageslide not to function on the contact page.
Like I mentioned before, it works fine on all the other pages, but the contact page. I have a feeling that the embedded form that was generated from constant contact might be causing the issue, but other than that, I have no idea.
Any suggestions?
You have multiple versions of jQuery in your code, which could be causing the problem (even though some of the other code seem to be working). You have v1.8.3 and v1.8.2.
One of them is being pulled from:
http://www.formstack.com/forms/js/3/jquery.min.js
the other one from:
http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js?ver=3.6
Fix that and your code should work.
Ok, I figured out what it was.
Looks like it was partially from what Hanlet said. There were two version of jQuery that were being pulled.
Apparently when I commented out the code that pulls in jQuery within my functions.php file it defaulted to the version that comes baked in with Wordpress which is version 1.10.2 and that apparently fixed the issue.
So, yeah. Hooray...I guess?
"pageslide" is not a build-in method for jquery selectors. You may want to double check if you include the "pageslide" javascript library / jquery plugin correctly.
I am attempting to utilize Trent Richardson's TimePicker jQuery UI plugin to add a time picking widget to a Wordpress plugin. jQuery and jQuery UI are both enqueued as they should be and are working fine (the Datepicker/Slider requirements for TimePicker have both been verified to be included and working as well as the TimePicker script is loading fine).
However, Firebug is giving me the following error:
TypeError: $.ui is undefined
The line in question is this:
$.ui.timepicker = $.ui.timepicker || {};
I understand that it's occurring because for some reason this script isn't finding $.ui (which I assume is a standard notation for referring to jQuery UI?) I also tried simply pre-defining the $.ui at the top and I got rid of that undefined error, but then it threw another for
$.datepicker
That is further on down in the code on line 973. There doesn't seem to be a lot of sense in explicitly defining $.ui and $.datepicker in the top of the script when they should be valid references to the jQuery objects... I'm just not sure how to fix what appears to be a broken link.
I ended up finding another TimePicker plugin that worked right "out of the box" so to speak. Literally just changed the reference from the old jquery.timepicker.js to the new jquery.ui.timepicker.js and everything is working beautifully.
My general intuition/feeling on the "old" script is that it might be using either an outdated or advanced api calling method that is causing problems with jQuery's/UI's version.
First of all, I'm not good with JavaScript at all. I followed all instructions on this page:
http://www.lokeshdhakar.com/projects/lightbox2/
Visually everything loads fine. However, visual studio throws this error while running. If I hit continue everything seems to be loading fine. I see all buttons, animation, etc. I can only guess that something not loading properly. But not sure..
I think i had the same problem as this. In the end I decided to go with this version of a different lightbox instead as it works like a jQuery plugin
http://leandrovieira.com/projects/jquery/lightbox/
For me I felt it was a lot nicer since it worked with jQuery as a Plugin, and didnt rely on the 6 js files!
I can't get Netbeans to auto-complete my selectors for JQuery, example:
<a id="hello" href="#">Hello</a>
<script type="text/javascript">
$("|").hide();
</script>
As far as i understand the documentation at this point it should show the tags available on the page when i press control+space at the | position, but instead displays no suggestions. Links [1] and [2] shows clearly that this has been implemented. I have not tried prototype, link [2] shows that JQuery support has been added as well.
The auto-complete of functions works perfectly, with the embedded library of JQuery 1.4.2, it is only the selector auto-complete that does not work. Any suggestions?
[1] http://wiki.netbeans.org/JavaScript#Embedded_Completion
[2] http://wiki.netbeans.org/JavaScript#Recently_Added
Product Version: NetBeans IDE 6.8 (Build 200912041610)
Java: 1.6.0_18; Java HotSpot(TM) Client VM 16.0-b13
System: Windows XP version 5.1 running on x86; Cp1252; en_US (nb)
5 years later update:
As of at least version 8.0.2 Netbeans now properly auto-completes jQuery selectors in both php and html pages. I am unsure if this is due to some other changes on the editor engine or they finally caught the discrepancy but either way it works now, yay!
Naor answer made me rethink what I was doing, but it didn't quite answer my question. So let me provide the solution I found in case anyone is interested.
When working with netbeans, the auto-complete function behaves differently between php files and html. In html jquery selectors auto-completes as expected. But when trying to do the same within a php file in an html section of code, it will fail to auto-complete.
Just make sure that if you are expecting this feature to work, that you are using html files, not php. I will submit this as a feature/bug to the netbeans guys, hopefully they can fix it and make html/js auto-completion available to all file types that can include html/js code.
Link 1 says that there is code completion on element ids that appear in the html itself. They also say that it works with Prototype.js. I believe that it would work for jquery too, but don't forget - in order to select an element using it id in jquery you do $('#id') - with #.
What they meant in their example if you have $("f|") is that if you start writing $("f and the cursor of typing is after the f (they put "|" in order to mark the cursor), then code completion should show all relevant elements.
Try that:
in html: <div id="blabla">12345</div>
in jscript: $('bl');
after the bl press control+space, and I believe that it will display to you blabla.