Page 1 of 1
jQuery Tabs [solved]
Posted: Sun Feb 17, 2013 10:42 pm
by douglas1438
Hope this is the right place to pose this question?
I'm trying to incorporate some jQuery tabs on to my page like these:
http://jqueryui.com/tabs/
But my page does some really odd things, like putting the whole page inside the tabs.
I've used jQuery elements before without any problem but this just won't work for me. If anyone can offer any advice it would be much appreciated.
I've stripped everything back to just the basic code but without success, have placed literal tags around code.
http://v102.co.uk/mosaicdigital/index.php?page=test-2
Thank you
Re: jQuery Tabs
Posted: Mon Feb 18, 2013 1:34 am
by Simon66
Hi
I'm having the exact same problem this weekend too.
It's because the latest versions of jQuery and jQueryUI don't play well with the <base href="
http://www.#####.com.au/" /> that is put in by the {metadata} tag.
If you remove the {metadata} temporarily from your template it should work, but this is just to test it as it is critical.
I'm still looking for a solution.
Simon66
Re: jQuery Tabs
Posted: Mon Feb 18, 2013 2:38 am
by Simon66
I've been trying various versions of jQuery, jQueryUI and jquery-ui.css.
I managed to get it to work with this combo:
<link rel="stylesheet" href="
http://code.jquery.com/ui/1.8.10/themes ... ery-ui.css" />
<__script__ src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></__script>
<__script__ src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js"></__script>
I'm going to stick with this for a while.
Simon66
Re: jQuery Tabs
Posted: Mon Feb 18, 2013 9:03 am
by velden
If you remove the {metadata} temporarily from your template it should work, but this is just to test it as it is critical.
{metadata} tag has a parameter to disable the base:
{metatag showbase='false'}
Re: jQuery Tabs [SOLVED]
Posted: Mon Feb 18, 2013 12:08 pm
by douglas1438
I've used Simon66's solution which is working for me.
Many thanks,
Chris
Simon66 wrote:I've been trying various versions of jQuery, jQueryUI and jquery-ui.css.
I managed to get it to work with this combo:
<link rel="stylesheet" href="
http://code.jquery.com/ui/1.8.10/themes ... ery-ui.css" />
<__script__ src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></__script>
<__script__ src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js"></__script>
I'm going to stick with this for a while.
Simon66
Re: jQuery Tabs [solved]
Posted: Wed May 08, 2013 3:11 pm
by zafari
Thank you for posting this solution! After spending hours upon hours of trying to get this to work BEFORE thinking to check these forums, I found this, implemented it and it works like a charm! Now I can take a nap!

Re: jQuery Tabs [solved]
Posted: Wed May 08, 2013 6:32 pm
by Dr.CSS
You can do this w/o the jquery-ui script as seen here, an example under Simple jQuery Tabs, very simple really...
http://how-i-did-that.com/