Works fine on pageload, but when navigating to another panel and back to the Welcome-page where the contentslider (#featured) is, the last script isn´t running. How can this be achieved?
I was thinking in line of an ONCHANGE og ONCLICK (clicking on the “WELCOME” menu item will activate my slider script.
I an not a Java programmer at all but II do know a fair bit of JavaScript - which is what that jQuery code is - it certainly isn’t Java.
Have you tried combining the code inside of a single document.ready or simply moving the scripts to the bottom of the page and discarding the document.ready test completely?
So you’d wouldn’t care whether someone put ham or hamsters in your sandwich for lunch if such totally different things are the same as far as you are concerned - since ham and hamsters are actually more colsoely related than Java and JavaScript are.
One further point - to be able to use jQuery you really need an intermediate level knowledge of JavaScript to be able to use it properly. You can get something to work with jQuery if you have a basic knowledge of JavaScript even though it will generally be somewhat messy and way more code than would really be needed. Trying to get jQuery to work without a basic knowledge of JavaScript is like trying to fly a commercial airliner when you don’t even have a driver’s licence.
Without a knowledge of JavaScript you are reliant on whoever wrote the script you are trying to use having written it in a way that will not conflict with the other scripts you are trying to use.
Like felgall said above you really do need to know JavaScript before you learn jQuery as there are some techniques that require moderate knowledge of JavaScript first, however in saying that see the below which is your code merged into on DOMReady function.
$(function() {
// Run the "fader" method on the #switcher-panel element
jcps.fader(300, '#switcher-panel');
// Bind the tabs plugin to the featured element
$('#featured').tabs({
fx : {opacity: 'toggle'}
}).tabs('rotate', 8000, false);
});
Now to explain a little, the $(function() {}); code above is a shorthand declaration for the jQuery DOMReady method. There is 2 other ways of calling the DOMReady method but personally I don’t recommend using this due to the syntax been longer and un-tidy, these methods can be seen below:
// This has been around since jQuery 1.0
$(document).ready(function() {});
// This can be seen used around the web but is not common
$().ready(function() {});
// This is the standard that should be used from now on
$(function() {});
You can see the variations between the two examples above are only slight but are ugly compared to use the shorthand declaration for the DOMReady method, in closing I would say again please ensure you learn a moderate level of JavaScript before you continue using jQuery as it will help in your future adventures with JavaScript.
I have lots of JS books, but to be fair they never really worked for me. I strongly recommend you use CodeAcademy to practice your code. It’s quite fun and you can learn whilst you undergo challenges. There are around 60+ individual jQuery courses there, so it’s packed with lots of fun!
On looking at your code you should only have 1 document.ready on the bottom. Don’t include 2, as this will slow things down. There is also another site called codeschool.com. Just like many don’t buys books any more for driving theory tests as everything is done interactively, same can be said for web programming. Enjoy and have fun learning!
