Using a link inside javascript

[StealthRT]

Hey everyone i have a quick question here... I'm using some code from http://www.ndoherty.com/demos/coda-slider/1.1.1/ called coda-slider. In order to slide from one DIV to another u us a link like so..

<p><a href="#2" class="cross-link">Next</a></p>

In the above code, the link would take you to the 2nd DIV.

Now my question is, how can i do that same thing but inside javascript with my code below?:

function Step1()
	{
		if (Checkit1())
		{
			//location.href='#2';
		}
		else
		{
			return false;
		}
	}

I've tryed the location.href='#2'; but it only changes the URL which doesnt move the box from DIV 1 to DIV 2 as the link would.

Any help would be great!
David

[jscheuer1]

As you might imagine, this is a complex script. There are variables whose scope is set in the code in such a way as to not be accessible globally. If the script is edited, this can be overcome and a function can be written to navigate in the global scope via number.

In the example I worked out, I used the demo page of the script and this edited version of coda-slider.1.1.1.js in place of coda-slider.1.1.1.pack.js:

Attachment 1465 (edited)

I was then able to make up a function that keyed off of the existing nav tabs of the demo:

function test_35a(n){
jQuery(document.getElementById('stripNavL0').parentNode.getElementsByTagName('a')[n]).addClass("current").parent().parent().find("a").not(jQuery(document.getElementById('stripNavL0').parentNode.getElementsByTagName('a')[n])).removeClass("current"); // wow!
var cnt = - (panelWidth*(n-1));
cPanel = n;
location.hash = cPanel;
jQuery(document.getElementById('stripNavL0').parentNode.getElementsByTagName('a')[n]).parent().parent().parent().next().find("div.panelContainer").animate({ left: cnt}, 750, 'expoinout');
}

n is the tab/panel number you want to navigate to. So you could call this function like:

test_35a(2);

to go to the second panel.

As I say, I only worked this out with the demo page, YMMV.

[StealthRT]

thank you jscheuer1 for your reply... but i just now got it working!!!

i used this:

jQuery().find("div.panelContainer").animate({ left: -1024}, 750, "expoinout");

the {left: -xxxx} is the position (cnt) of the frame after it slides... so mine is in 1024x768 so the first tab = 0, the second = 1024, the third = 2048, etc etc. The 750 and "expoinout" are better know as settings.easeTime & settings.easeFunc which are the default values already in place, i just had to include them so it would know what to do.

Again, thanks for the help!
David

[mackjohn]

jscheuer1:

I found your solution by googling and it brought me closer to solving my problem which is as follows. I need a javascript function to slide on to the next panel(other than specifying the panel myself).. im sure its pretty simple(?) but i cant figure it out because jquery is totally new for me.

Anyone have any ideas? I would be most grateful for any advice as this is really making me throw my keyb out of the window.

Regards,

J

[jcrog]

I'd like one of the tabs to go to a URL instead of a panel. Does anyone know how to do that?

Thanks