有关 JQuery 手风琴的帮助吗？

发布于 2024-09-26 05:47:07 字数 333 浏览 3 评论 0原文

我在将 JQuery 手风琴放入网站时遇到了一些麻烦。我觉得我做的一切都是对的，但效果却不佳。我已经建立了该网站，并在手风琴中添加了一些简单的 Lorem Ipsum 文本。如果有人可以提供帮助，我们将不胜感激。这是链接：http://www.catanesedesign.com/test/events.html .我无法使该网站上的代码清晰易读，但您可以在链接中查看源代码。底部有一些没有内容的 div，但这只是因为我还没有完成页面，这些不应该影响手风琴。

预先感谢您的任何帮助。

原文

分享到QQ

分享到微博

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

发布评论

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

平生欢 2024-10-03 05:47:07

首先，您的 jQuery UI css 文件似乎有问题。它说 404 - 未找到。

回复收藏 0 原文

深居我梦 2024-10-03 05:47:07

我拿出了 lavalamp 的东西并使用了其他一些 jquery 文件并让它工作：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>Alliance for New Music Theater</title> 
<link href="css.css" rel="stylesheet" type="text/css" /> 
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script type="text/javascript"> 
    $(function() {
        $( "#accordion2" ).accordion();
    });
    </script> 
    <link href="jquery-ui-1.8.5.custom.css" rel="stylesheet" type="text/css" /> 
</head> 

<body> 
<div id="container" align="center"> 
<div id="header"> 
<img src="header.jpg" width="800" height="100" alt="curtains" /> 
</div> 
<div id="navbar"> 
<ul class="lavaLamp"> 
            <li><a href="#">Home</a></li> 
            <li><a href="#">Featured Work</a></li> 
            <li><a href="#">Featured Artist</a></li> 
            <li><a href="#">Members</a></li> 
            <li><a href="#">Events</a></li> 
        </ul> 
</div> 
<div id="row1">
<div id="accordion2"> 
    <h3><a href="#">Section 1</a></h3> 
    <div> 
        <p> 
        Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
        ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
        amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
        odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
        </p> 
    </div> 
    <h3><a href="#">Section 2</a></h3> 
    <div> 
        <p> 
        Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
        purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
        velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
        suscipit faucibus urna.
        </p> 
    </div> 
    <h3><a href="#">Section 3</a></h3> 
    <div> 
        <p> 
        Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis.
        Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero
        ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
        lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui.
        </p> 
    </div> 
    <h3><a href="#">Section 4</a></h3> 
    <div> 
        <p> 
        Cras dictum. Pellentesque habitant morbi tristique senectus et netus
        et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
        faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
        mauris vel est.
        </p> 
    </div> 
</div> 
</div> 
</div> 
</div> 
</body> 
</html>

I took out the lavalamp stuff and used some other jquery files and got it to work:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
<title>Alliance for New Music Theater</title> 
<link href="css.css" rel="stylesheet" type="text/css" /> 
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
  <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script>
<script type="text/javascript"> 
    $(function() {
        $( "#accordion2" ).accordion();
    });
    </script> 
    <link href="jquery-ui-1.8.5.custom.css" rel="stylesheet" type="text/css" /> 
</head> 

<body> 
<div id="container" align="center"> 
<div id="header"> 
<img src="header.jpg" width="800" height="100" alt="curtains" /> 
</div> 
<div id="navbar"> 
<ul class="lavaLamp"> 
            <li><a href="#">Home</a></li> 
            <li><a href="#">Featured Work</a></li> 
            <li><a href="#">Featured Artist</a></li> 
            <li><a href="#">Members</a></li> 
            <li><a href="#">Events</a></li> 
        </ul> 
</div> 
<div id="row1">
<div id="accordion2"> 
    <h3><a href="#">Section 1</a></h3> 
    <div> 
        <p> 
        Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer
        ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit
        amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut
        odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate.
        </p> 
    </div> 
    <h3><a href="#">Section 2</a></h3> 
    <div> 
        <p> 
        Sed non urna. Donec et ante. Phasellus eu ligula. Vestibulum sit amet
        purus. Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor
        velit, faucibus interdum tellus libero ac justo. Vivamus non quam. In
        suscipit faucibus urna.
        </p> 
    </div> 
    <h3><a href="#">Section 3</a></h3> 
    <div> 
        <p> 
        Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis.
        Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero
        ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis
        lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui.
        </p> 
    </div> 
    <h3><a href="#">Section 4</a></h3> 
    <div> 
        <p> 
        Cras dictum. Pellentesque habitant morbi tristique senectus et netus
        et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in
        faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia
        mauris vel est.
        </p> 
    </div> 
</div> 
</div> 
</div> 
</div> 
</body> 
</html>

回复收藏 0 原文

~没有更多了~