我如何链接jquery-ui-tabs所依赖的#href

时间:2013-04-03 00:00:44

标签: jquery href jquery-ui-tabs

我在本教程中重新使用了基于jQuery的图像滑块:

http://webdeveloperplus.com/jquery/featured-content-slider-using-jquery-ui

在大多数情况下,它的效果很好,但事物的描述方面依赖于href被设置为"#fragment-whatever number"。基本的HTML设置看起来像这样:

<div id="featured" >  
    <ul class="ui-tabs-nav">  
        <li class="ui-tabs-nav-item ui-tabs-selected" id="nav-fragment-1">
          <a href="#fragment-1"><img src="images/image1-small.jpg" alt="" />
            <span>15+ Excellent High Speed Photographs</span>
          </a>
        </li>
</ul>

<div id="fragment-1" class="ui-tabs-panel" style="">  
        <img src="images/image1.jpg" alt="" /> 
</div>
</div>

这是运行它的jQuery:

$(document).ready(function () {
    $("#sliderContainer > ul").tabs({
        fx: {
            opacity: "toggle"
        }
    }).tabs("rotate", 5000, true);
    $("#sliderContainer > ul").hover(function () {
        $("#sliderContainer > ul").tabs({
            event: "mouseover"
        }).tabs("rotate", 0, true);
    }, function () {
        $("#sliderContainer > ul").tabs("rotate", 5000, true);
    });

现在,我的问题是我想将列表中的内容设置为“#fragment”以外的链接。我不知道该怎么做。有什么想法吗?

1 个答案:

答案 0 :(得分:0)

我似乎回答了自己的问题。 我在虚拟标签后面的a标签中添加了一个onclick事件,如下所示:

<a href="#fragment-1" onclick="javascript: goto_this_page('http://wherever.com')">

我在它上面的某个地方创建了这个函数来处理onclick调用:

var goto_this_page = function (this_href) {
var href = this_href;
window.location.href = href;
}

这似乎暂时解决了这个问题。当然,我愿意接受更好的解决方案。