Jquery UI tabs question
- Started
- Last post
- 9 Responses
- flashbender
Does anyone out there (glances in stugoo's direction) know if it is possible to make a jquery UI tab nav item open not in the tabbed section of the page? i.e. force it to behave like a normal link?
maybe it is clearer to see an example:
What I'm trying to accomplish is to have the yellow button below act like a "normal" link instead od loading into the tabbed area - which obviously causes all hell to break loose.
http://www.flashbender.com/BSIus…
thanks.
oh, the obvious target=_parent / target=_self do not work.
- lukus_W0
<li class="viewAll"><a href="/en-us/blahblahblah">View All Solutions</a></li>
... is nested in the same <ul> element as the tabs that are used for tab-navigation. The jquery plugin automatically applies it's magic to list elements within the <ul> ... </ul>.
So ... Move the link so it's no longer within the <ul>...</ul> and use CSS to style it and place it flush with the other elements. You'd also get rid of the <li> tags that immediately surround it, because they'd no longer be relevant.
Also, don't forget; to be able to style the anchor properly - you'll need to apply 'display: block;' to it so that you can apply width, height etc.
- flashbender0
Thanks for the reply
I tried that and it is fine in all mac browsers but breaks in IE 6/7
I tried that and it forces the "viewAll" link above the nested tab content. Trying a variety of placement options, the only way to get it where it needs to be in all browsers is with absolute positioning but this breaks immediately if someone has browser text set larger than default.
I also tried
$('#Htabs .Vtabs .ui-tabs-nav li.viewAll a').attr("target", "_self"); and that does not work either, although curiously
$('#Htabs .Vtabs .ui-tabs-nav li.viewAll a').attr('title', 'This link should not open in a tab'); does work.
- dijitaq0
if you're using jquery maybe you can use the jquery events and do something like this:
$("#yellow_button_id").click({
top.location("url");
});
- flashbender0
ooh, good idea. I'll give that a shot, but I suspect the tabs event might over ride it like it does the attr.
off to test...
- flashbender0
no worky for me.
Thanks for the idea though, I got excited for 5 minutes.
- acescence0
when it tabifies the page, it's stripping your href out completely and replacing it with some identifier. maybe after it does all the tab js stuff, you can unbind the click event from that anchor, reset the href and then re-bind the click to a new behavior.
- or just use jq to inject the link into the dom after all the tab stuff runsacescence
- or masturbate furiouslyrounce
- hahaspraycan
- I'm more skilled at the furious masturbating than injecting jquery codeflashbender
- graphiknature0
Why don't you just make it a normal link with some css around it to make it look like a tab?
- flashbender0
Yeah, I'v let it sit but when I feel like getting frustrated again I'll poke around in the tabs.js a bit and see just how it does what it does and if I can jam an if clause in there somewhere so I can detect for a class or Id.
graphiknature - yeah, that's the back up plan, but then it'll be some jquery bit to add classes on click to make a "selected" state.
thanks all