jquery script not changing div's class - javascript

On my single page site, I have a script that is called to add a "read more" style link to a content area's div.
When the button is clicked, it should change the class of the content area to allow view of all of the content.
When clicked again, it should hide the content.
This is the site I'm having trouble on: http://lexisnexis.stacklaw.com.au/
But, it is working OK on this site: http://nundoobah-retreat.com.au/about.html
What have I got wrong?

JQuery is throwing a script error -- "can't find .curCSS" when your script runs the switchClass method.
I'm not sure, but this may be due to the fact that you're running an older version of JQuery UI than the JQuery core:
<script type="text/javascript" src="/templates/microsites//js//jquery-1.8.3.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js" type="text/javascript"></script>
The curCSS method was deprecated in JQuery 1.8.0.
I'd suggest upgrading to the latest version JQueryUI. Alternatively, don't use switchClass (which belongs to JQuery UI), but instead use removeClass / addClass, or slideUp / slideDown (part of the core JQuery library).

Here is curcss issue with jquery-ui. http://bugs.jquery.com/ticket/11921
You might use jquery-ui later 1.9.0.

Related

jQuery not working in Blogger

I am tryting to install a facebook slider tab in a friend's blog and I cannot make it work.
This is her blog: http://secretosdeprofe.blogspot.com.es/
And this is the tutorial: http://www.theblogwidgets.com/2013/11/floating-facebook-like-box-widget-for.html
jQuery is installed in the blog (hence the hover Pin it button working on images) but when hovering the mouse over the facebook tab, the widget does not come out
Any ideas why is not working?
Thanks!
You are using the jQuery variable in a <script> (line 1090) element before you add <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'></script> (line 1543), at the time when your earlier script block was parsed jQuery hadn't been defined. It's possible with a little extra work to queue something before jQuery is included (as shown here) but this approach will still require some code after jQuery is loaded in order to be referenced by jQuery's onReady listener.

Jquery DataTable Script Loaded but Not Available On Browser DOM

I have referenced jqyery dataTabes and JS.
The results hows that call went ere but will im unable to find DataTable there and shows it as result.
<link href="https://cdn.datatables.net/1.10.8/css/dataTables.bootstrap.min.css" rel="stylesheet">
<script src="https://cdn.datatables.net/1.10.8/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.8/js/dataTables.bootstrap.min.js"></script>
In Browser :
although the JS / CSS loads
But still it doenst exist on DOM , so when i try to apply it to any element it doesnt apply.
So what is the error why its not being applying in DOM of browser or from code
DataTable is a jQuery plugin so you need to make sure you are also including jQuery on your page. jQuery will need to be included before you include DataTables. Then to initialize DataTables, you'll need to use $('<table selector>').DataTable(), making sure to insert the real selector for your table.
Problem was the jquery reference , i was referencing to jquery 2.1.1 and 2.1.4 version of jQuery. removing 2.2.1 made it worked

Jumi plugin doesnt seem to load jQuery and images called with css in joomla 1.5

I have a select list I have styled using html, css& js, it is working independently but once I load it into an article it displays the default html select list. I have tried positioning the customized select.html using Jumi plugin it loads most css but somehow refuses to load images called in the css. Help
First of all, the last time I used Joomla, it uses Mootools. Mootools and jQuery don't get along well because they fight over $ namespace and most people use $ in jQuery code.
to prevent this, you should either
use $.noConflict() to change the jQuery namespace
use jQuery instead of $ in your code
enclose your code in a closure:
(function($){
//use `$` safely in here
}(jQuery))

jQuery simple dialog not working

I'm trying to figure out why my jQuery dialog is not working properly on this page:
http://bit.ly/nOKwYz
This is the code snippet:
<script type="text/javascript">
jQuery(document).ready(function() {
jQuery("#dialog22").dialog();
});
</script>
and I also have:
<div id="dialog22">test</div>
For some reason it does not load the dialog, any ideas?
It's gotta be the library order. See this fiddle. Your sample works just fine if you have the library order right:
http://jsfiddle.net/mikethomsen/a25gw/
The way it works is you need to load jQuery.js, jQuery UI's JS and then the jQuery UI CSS, then throw in your custom code.
Edit
I replaced my fiddle's libraries with your sample and Firefox says jQuery('#dialog').dialog is not a function. That means you are missing the dialog code from the build of jQuery UI you made. You need to go back to the jQuery UI site and build a new distribution of jQuery UI that includes the other pieces you need.
To show the dialogo you should first hide it i think:
<div id="dialog22" style="display:none;">test</div>
and then show it with a button for example
EDIT - look at the fiddle here : http://jsfiddle.net/LCPJe/
Where do you load jQuery (and jQuery UI) on that page? You need to reference those libraries in the page (specifically before any code that uses them). Unless I'm just not seeing the reference, you do have quite a few script tags in the header.
You don't have to host a copy, though. You can reference a CDN link.

jQuery UI slider doesn't seem to render?

I may be missing something completely obvious here but when I call $("#zoom_slider").slider() I get no slider appear.
If you goto this url you can replicate the issue by click on any of the images in the main window, this will then load a larger image (currently of a watch). The slider should appear to the top right underneath where it says "Zoom" but it does not...
I include the jQuery UI from google via this call:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/jquery-ui.min.js"></script>
I can't say for sure, but what I would try to do would be to put all of your script declarations in the <head></head> section of your HTML. Also, make sure you are using the most up to date versions of jQuery UI and jQuery.

Categories