我将如何在我的html结构中使用这个? [英] How would I use this in my html structure?
问题描述
我是新的jquery,我不想结束做错了的事情,我做了一切,但我坚持这一部分。我如何钩这个是up?我尝试使用脚本标签,但我不确定是否这样。
I'm new to jquery and I don't want to end up doing the wrong thing, I've done everything else but, I'm stuck on this part. How do I hook this is up? I've tried using script tags, but I'm not sure if thats right.
$(document).ready(function() {
$('.menu').dropit()
});
确定我已经做了你们的建议,但它仍然不工作。
完整代码:
Ok I've done what you guys suggested, but it still does not seem to work. Heres the full code:
<!doctype html>
<html>
<head>
<script src="//code.jquery.com/jquery-1.10.2.min.js"></script>
<script src="path/to/your/jquery/script.js"></script>
<script src="dropit.js"></script>
<link rel="stylesheet" href="dropit.css" type="text/css" />
<style>
body
{
background:url("");
background-size:0px 0px;
background-repeat:no-repeat;
padding-top:40px;
}
</style>
<STYLE>
<!--
a:hover{color:#c0c0c0;}
-->
</STYLE>
<style>
.navLink {
color: #000000;
text-decoration: none !important;}
ul
{
list-style-type:none;
font-size: SMALL;
font-family: 'Ubuntu Condensed', sans-serif;
font-weight: lighter;
font-style: regular;}
li
{
display:inline;
}
</style>
</head>
<body>
<img border="0" src="http://az61389.vo.msecnd.net/6/_ui/img/mosaic/big-transparent-block.png" alt="Vealed" width="100" height="70">
<HR COLOR="#C0C0C0" WIDTH="100%">
<ul id="nav" >
<img border="0" src="http://www.miacreative.com/ESW/Images/WHITE-BOX-MID.png" alt="Vealed" width="450" height="1"> <li><a href="#">
<a href="#">MENS</a>
<ul>
<li><a href="#">Shirts</a></li>
<li><a href="#">Jackets</a></li>
<li><a href="#">Denim</a></li>
<li><a href="#">Fleece</a></li>
</ul>
</li>
<img border="0" src="http://www.miacreative.com/ESW/Images/WHITE-BOX-MID.png" alt="Vealed" width="30" height="1">
<li><a href="#" class="navLink">WOMEN'S</a></li>
<img border="0" src="http://www.miacreative.com/ESW/Images/WHITE-BOX-MID.png" alt="Vealed" width="30" height="1">
<li><a href="#" class="navLink">NEW ARRIVALS</a>
<img border="0" src="http://www.miacreative.com/ESW/Images/WHITE-BOX-MID.png" alt="Vealed" width="30" height="1">
<li><a href="#" class="navLink">BLOG</a>
<img border="0" src="http://www.miacreative.com/ESW/Images/WHITE-BOX-MID.png" alt="Vealed" width="30" height="1">
<li><a href="#" class="navLink">SALE</a>
</ul>
<HR COLOR="#C0C0C0" WIDTH="100%">
<ul id="nav" >
<img border="0" src="http://az61389.vo.msecnd.net/6/_ui/img/mosaic/big-transparent-block.png" alt="Vealed" width="0" height="2">
<p><p align="center"><img border="0" src="http://img593.imageshack.us/img593/6192/5eo7.png" alt="Vealed" width="800" height="500">
<img border="0" src="http://az61389.vo.msecnd.net/6/_ui/img/mosaic/big-transparent-block.png" alt="Vealed" width="70" height="2">
</ul>
<img border="0" src="http://az61389.vo.msecnd.net/6/_ui/img/mosaic/big-transparent-block.png" alt="Vealed" width="100" height="200"
<script type="text/javascript">
$(document).ready(function() {
$('.menu').dropit();
});
</script>
</body>
</html>
我想要使菜单中的所有链接都有下拉菜单。 p>
I wanted to make it so that all the links in the menu will have a drop down.
推荐答案
将脚本标签放在头部标签之间,如下所示
Put the script tag in between your head tags like so
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js" type="text/javascript"></script>
</head>
将正好位于结尾正文之前。
put this right before the closing body tag like so
<script type="text/javascript">
$(document).ready(function() {
$('.menu').dropit();
});
</script>
</body>
另一个选择,底部,是将所有的javascript / jquery放在一个单独的文件。然后只是链接到它。
Another option, instead of putting your jQuery code at the bottom, is to put all your javascript/jquery in a separate file. And then just link to it.
例如
<script type="text/javascript" src="myjsfilename.js"></script>
</body> //again, you put this right before the closing body tag
然后在你的myjsfilename.js文件,你会有
And then in your myjsfilename.js file, you would have
$(document).ready(function() {
$('.menu').dropit();
});
再加上您要添加的JavaScript / jquery代码
plus anymore javascript/jquery code you want to add
这样做有助于保持组织的安排
Doing it that way can help keep things organized
这篇关于我将如何在我的html结构中使用这个?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!