jQuery

[tonynoriega]

trying to get a understanding of jQuery...

ive seen some pretty nice looking mini apps that people have build... tabbed navigation, pop up boxes, ..e.tc...

do i need to have the jquery.js file on my web server to make use of jquery? is that necessary?

[blang]

do i need to have the jquery.js file on my web server to make use of jquery? is that necessary?

Well, yes in the sense of "do I have to include the jquery code base in my document", but no in the sense that it has to physically be on your server. You can use Google's Ajax API [code.google.com] for example to load jQuery from their server, thus saving you bandwidth. Plus you always get the most current version. It's probably easier to just grab the current minified version and place it in a central location (e.g. a 'js' folder under the web root) so you always have it on your own server.

All of your other questions can be answered at the jQuery website [jquery.com]. They have excellent documentation and examples.

[whoisgregg]

jQuery is just a javascript library. There's nothing that you can do with it that you couldn't do without it, it'd just take a lot more coding.

Each of the popular javascript libraries can be incredibly helpful and they mostly offer the same benefits. It's just a matter of picking one which makes sense to you as far as coding style.

I'm a Prototype fan myself. ;)

[tonynoriega]

i think i got it now... i am using a tabbed menu script thats pretty nice. uses a UL and a content box... problem im having with it is that i can not put the tabs under the content box....

killing me...

[tonynoriega]

Ok, now i have to ask....

i have a tabbed content menu script. 5 tabs on top. content box below that.

$(document).ready(function(){
$('ul.tabNav a').click(function() {
var curChildIndex = $(this).parent().prevAll().length + 1;
$(this).parent().parent().children('.current').removeClass('current');
$(this).parent().addClass('current');
$(this).parent().parent().next('.tabContainer').children('.current').fadeOut('fast',function() {
$(this).removeClass('current');
$(this).parent().children('div:nth-child('+curChildIndex+')').fadeIn('normal',function() {
$(this).addClass('current');
});
});
return false;
});
});

and the HTML:

<div id="maintabcontainer">

<ul class="tabNav">
<li class="current"><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
<li><a href="#">4</a></li>
<li><a href="#">5</a></li>
</ul>

<div class="tabContainer">
...content goes here...

</div><!--/tabContainer-->

</div><!--/maintabcontainer-->

but when i try to put the UL tabNav under the tabContainer it kills the script.

im assuming i can modify this script to allow that... is that possible?

any tips would help.. thanks

[tonynoriega]

Problem resolved. thanks