HTML、Jquery 鱼眼菜单

发布于 2024-10-06 23:54:57 字数 2017 浏览 0 评论 0原文

我已经使用了鱼眼 jquery "interface.js" 我想使用 make 第三个元素 id="default" 应该显示默认的鼠标悬停效果,请帮助我提前感谢

HTML

<div class="dock" id="dock1">
    <div class="dock-container2">
        <a class="dock-item2" href="#" ><span>E-Mail</span><img src="images/ui/img1.png" alt="home" width="40"/></a>
        <a class="dock-item2" href="#"><span>Contact</span><img src="images/ui/img2.png" alt="contact" width="50" /></a>
        <a class="dock-item2" href="#" id="default"><span>Car</span><img src="images/ui/img3.png" alt="portfolio" width="60"/></a>
        <a class="dock-item2" href="#"><span>Home</span><img src="images/ui/img4.png" alt="music" width="70" /></a>
        <a class="dock-item2" href="#"><span>Air Line</span><img src="images/ui/img5.png" alt="video" width="80"  /></a>
        <a class="dock-item2" href="#"><span>Train</span><img src="images/ui/img6.png" alt="history" width="70"/></a>
        <a class="dock-item2" href="#"><span>Hotel</span><img src="images/ui/img7.png" alt="calendar" width="60"/></a>
        <a class="dock-item2" href="#"><span>Links</span><img src="images/ui/img8.png" alt="links" width="50"/></a>
        <a class="dock-item2" href="#"><span>Call Us</span><img src="images/ui/img9.png" alt="rss" width="40" /></a>
    </div>
</div>

Script

$(document).ready(function() {
    $('#dock1').Fisheye({
        maxWidth: 60,
        items: 'a',
        itemsText: 'span',
        container: '.dock-container2',
        itemWidth: 40,
        proximity: 80,
        alignment: 'left',
        valign: 'top',
        halign: 'center'
    });
    $("#pagecontent").slider();
});

I have used the fisheye jquery "interface.js" I want to make make 3rd element with
id="default" should be show default like mouse over effect , Please help me thanks in advance

HTML

<div class="dock" id="dock1">
    <div class="dock-container2">
        <a class="dock-item2" href="#" ><span>E-Mail</span><img src="images/ui/img1.png" alt="home" width="40"/></a>
        <a class="dock-item2" href="#"><span>Contact</span><img src="images/ui/img2.png" alt="contact" width="50" /></a>
        <a class="dock-item2" href="#" id="default"><span>Car</span><img src="images/ui/img3.png" alt="portfolio" width="60"/></a>
        <a class="dock-item2" href="#"><span>Home</span><img src="images/ui/img4.png" alt="music" width="70" /></a>
        <a class="dock-item2" href="#"><span>Air Line</span><img src="images/ui/img5.png" alt="video" width="80"  /></a>
        <a class="dock-item2" href="#"><span>Train</span><img src="images/ui/img6.png" alt="history" width="70"/></a>
        <a class="dock-item2" href="#"><span>Hotel</span><img src="images/ui/img7.png" alt="calendar" width="60"/></a>
        <a class="dock-item2" href="#"><span>Links</span><img src="images/ui/img8.png" alt="links" width="50"/></a>
        <a class="dock-item2" href="#"><span>Call Us</span><img src="images/ui/img9.png" alt="rss" width="40" /></a>
    </div>
</div>

Script

$(document).ready(function() {
    $('#dock1').Fisheye({
        maxWidth: 60,
        items: 'a',
        itemsText: 'span',
        container: '.dock-container2',
        itemWidth: 40,
        proximity: 80,
        alignment: 'left',
        valign: 'top',
        halign: 'center'
    });
    $("#pagecontent").slider();
});

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

溺ぐ爱和你が 2024-10-13 23:54:57

尝试这样的事情:

$(".dock-container2:nth-child(3)").attr("id", "default")

Try something like this:

$(".dock-container2:nth-child(3)").attr("id", "default")
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文