jQuery响应菜单插件PgwMenu

来源:互联网 发布:如何远离网络暴力 编辑:程序博客网 时间:2024/06/03 19:24

添加jquery库,pgwmenu.min.js以及样式文件

1
2
3
<link rel="stylesheet" type="text/css" href="pgwmenu.min.css"/>
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="pgwmenu.min.js"></script>


html结构

1
2
3
4
5
6
7
8
9
10
11
<ul class="pgwMenu">
        <li><a href="http://www.jq22.com">Link 1</a></li>
        <li><a href="#">Link 2</a></li>
        <li><a href="#" target="_blank">Link 3</a></li>
        <li><a href="#">Link 3</a></li>
        <li><a href="#">Link 4</a></li>
        <li><a href="#" target="_blank">Link 5</a></li>
        <li><a href="#">Link 6</a></li>
        <li><a href="#">Link 7</a></li>
        <li><a href="#" target="_blank">Link 3</a></li>
</ul>


js调用插件

1
2
3
4
5
<script type="text/javascript">
    $(document).ready(function(){
         $('.pgwMenu').pgwMenu();
    });
</script>
0 0
原创粉丝点击