JavaScript tabs - too many if functions that control it - javascript

I have several tabs that my site changes between using Javascript. When ever a tab is clicked I need to know which one it was and which one I am currently on.
I have done this through the use of if functions(lots!). I now want to add a new tab and I have to expand all my if functions etc.
Is there a different implementation I can use for this, so future adding of tabs is easy and I don't have to use so many if functions.
I hope I made sense and there is a solution.

The obligatory answer: Use jQuery, and then use jQuery Tabs. The Tabs plugin generates callbacks that pass to it both the tab being shown and the tab being hidden, which should work nicely for you.
If for some reason you are masochistic and enjoy writing plain Javascript for no apparent reason, then you need to post the code you are using so we can better help you.

Related

What part of jQuery UI puts the ui-widget-loading class on and how can it be removed?

I am attempting to integrate jQuery UI tabs with knockout and I'm having a problem with tabs added at the start of my js. They seem to have a class ui-tabs-loading and I'm not sure why.
Here is the fiddle: http://jsfiddle.net/edhedges/mPbAL/
As you can see at the bottom of the js I am removing that class, but if you comment that out it breaks the first three tabs.
To "answer" your question, the ui-tabs-loading class appears to be added when an ajax request is spawned to fill the tab content (source: line #801 - https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.tabs.js). As to why this particular case is being treated as ajax by jQuery UI, I'm still looking into that because I'm curious.
I know that jQuery plugins historically don't work well with javascript data-binding frameworks, but there's definitely always a work around.
I'll update my answer if I figure something out.

How to create 2 Image rotation carousels on the same page using one jquery script file

new to jquery need help please!!... - I'm trying to create two carousels on the home page using the example below but doesn't seem to work.
I realise that the example is using ids, tried to change them to classes but didnt it do much.
http://www.dreamcss.com/2009/04/create-beautiful-jquery-sliders.html
Thanks
An important philosophy in jQuery is "Don't reinvent the wheel."
Just use a plugin for features like this, such as Easy Slider!
Here's a demo of more than one on a single page
Oh, and in the future, be sure to describe what doesn't work as well as your code if you want people to actually be able to help you with your specific problem.

A panel to configure JavaScript parameters on a website

I am looking for a library that would create a "settings panel" with configurable amount of sliders, checkboxes, etc and add it to a website. After a slider or checkbox is changed in the panel, a callback function would be executed.
Rationale: I am building a canvas demo and I don't want to spend time on writing my own set of controls for configurable parameters. I want to outsource this job to a small library that does it right.
I saw such thing few months ago but I cannot find it now.
Finnaly I found what I was talking about back then:
dat.gui is a cool JavaScript ilbrary that gives you a control panel
for manipulating variables and calling functions in your code. It’s
lightweight and simple to implement – just a few lines of code.
demos
jQueryUI provides some helpful UI elements, such as slider. For checkboxes you can use event callbacks

Switch information using jQuery

I am thinking of applying a new page to the admin section on my website and I wanted to make one page with three tabs ( picture should be included ) is this possible using jQuery.
Thanks a lot.
There are several jQuery tabs plugins out there:
jquery UI Tabs
jQuery Tools tabs
Yetii (more lightweight solution)
Create your own
If you don't need much functionality then just create your own with 3 links/elements and a set of <div> (or any other container) elements.
Yes, of course it's possible.
In fact, there are built in jQuery UI and enumerable plugins which do the job.
It sure is. But you don't even need jQuery to do this. CSS can do this quite simply.
See here for some examples.

Display tabs like FireFox's on my website

I want to implement with jQuery a tabbed interface for my website (like the firefox ones). They should also be able to be moved like the ones FireFox has.
If anyone knows of an already written library, please give me a link.
If you're already using jQuery, the jQuery UI Tabs has a sortable option for this.
Checkout the other demos for all the widgets there as well...in most cases it's not worth it to include the jQuery UI library for any 1 widget or effect...but if you can make use of a few of them, it's a nice library to work with. Of course there are alternatives out there, just throwing this as the simple/configurable option.
As a side note, it is jQuery UI....style it like you want.
ExtJS is more suitable for such interfaces. In the process of trying it out you will find many more amazing possibilities that it opens up. Also, it is very well written and a pleasure to work with.

Categories