2009-11-13 41 views
0

它不会让我提交多个环节,所以请使用你的想象力,我需要复式鼠标悬停或图像多个标签,以便在中间的那个东西是一个图像你如何使jquery选项卡既鼠标悬停,但点击打开页面?

<script type="text/javascript"> 
$(function() { 
$("#tabs").tabs({event: 'mouseover'}).addClass('ui-tabs-vertical ui-helper-clearfix'); 
$("#tabs li").removeClass('ui-corner-top').addClass('ui-corner-right'); 
$('.openpage').click(function(){ 
    window.location=$(this).attr('title'); 
    }); 
}); 
</script> 

<div id="tabs"> 
<ul> 
<li><a href="#tabs-1" title="content1.html" class="openpage">content1</a></li> 
</ul> 
<div id="tabs-1"><imgimg src="/images/1.jpg" alt=""></div> 
</div> 
+0

提交多个链接是什么意思?你需要多个鼠标悬停标签,你是什么意思? – 2009-11-13 08:57:34

+0

你想在鼠标上触发什么效果?点击应该只显示标签内容,而不是打开新页面。 – Steven 2009-11-13 08:58:21

回答

0

此代码是从jQuery Docs取。

HTML代码。请注意,我已经为选项卡添加了类。现在

<div id="tabs"> 
    <ul> 
     <li class="tab1"><a href="#fragment-1"><span>One</span></a></li> 
     <li class="tab2"><a href="#fragment-2"><span>Two</span></a></li> 
     <li class="tab3"><a href="#fragment-3"><span>Three</span></a></li> 
    </ul> 
    <div id="fragment-1"> 
     <p>First tab is active by default:</p> 
     <pre><code>$('#example').tabs();</code></pre> 
    </div> 
    <div id="fragment-2"> 
     Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. 
     Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. 
    </div> 
    <div id="fragment-3"> 
     Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. 
     Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. 
     Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. 
    </div> 
</div> 

,如果你想添加的标签多重影响,所有你需要做的是以下几点:

$(document).ready(function(){ 
    $("#tabs").tabs(); 
    $("#tabs .tab1").click(function() { alert('hello world'); }); 
    }); 

我没有测试这一点,但我认为它应该工作。

相关问题