Hi Lincolnpixel,
Ok, so far I’ve got this working:
<scr*ipt type="text/javascript">
$(function() {
$('#nav-cntr > ul#nav').tabs({
event: 'mouseover',
fxFade: true,
fxSpeed: 'fast'
});
$('#nav-cntr > ul#nav a').click(function(){
if ($(this).attr('rel') != '' && $(this).attr('class') == 'external') {
top.location = $(this).attr('rel');
}
return false;
});
});
</scr*ipt>
This is what I changed in the markup:
<div id="nav-cntr">
<ul id="nav">
<li><a href="#home">Home</a></li>
<li><a href="#calcio11">CALCIO 11</a></li>
<li><a href="#calcio7">Calcio 7</a></li>
<li><a href="#calcio5">Calcio 5</a></li>
<li><a href="#calcio35">Calcio Over 35</a></li>
<li><a href="#calcio45%22class=%22external" rel="http://lincolnpixel.com/" class="external">External</a></li>
<li><a href="#calcio9" title="Torneo 9">Torneo 9</a></li>
<li><a href="#calciogio" title="Torneo Giovanile">Torneo Giovanile</a></li>
</ul>
Notice I reference an A name anyways for the hardlink, and store the link itself in rel=“http://www.whereever.com/”, and use the href=”#gohere” which can reference a blank UL.LI (not what I recommend, it being a blank LI), or one that has a description of what is contained in the external link:
<div id="calcio45">
<ul>
<li><a href="http://www.creazionesitiweb.net/index.php/uisp/eccellenza_a/" class="first">An explanation of where the link leads</a></li>
</ul>
</div>
Does that make sense?
When you create the ui.tabs, the A.HREF is actually used to point to the DIV#ID of another element, but when you mouse over the externally linked element, it instead looks for DIV#ID that doesn’t exist, throwing a Javascript error.
Another option could be just to make it a blank space:
<div id="calcio45"> </div>
And, to the user, it will look normal.
Also, you’ll need to adjust the Torneo link:
http://www.nabble.com/TABS—-Error-with-special-characters-in-fragment-td15150628s27240.html
Using the title attribute is causing errors, as I think the ui.tabs script uses that to either create or store a hash file to prevent name collisions on the page, and somewhere it’s munging the script. You might consider a jQuery clueTip:
http://plugins.jquery.com/project/cluetip
If you’re using text on the page that is using special language characters in another character set other than UTF-8, you might consider outputting another charset:
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
I don’t know that much about character sets, but it’s something to consider.
😊