jquery.agilebins下拉菜单及幻灯片滚动示例代码-html代码-BFW代码库

代码语言：html

代码描述：jquery.agilebins下拉菜单及幻灯片滚动示例代码，Agilebins是一个基于jQuery运行的开源特效插件，快速解决网页大部分特效。使用简单，维护方便。无需懂得js代码编写。轻松制作，导航菜单、幻灯片、焦点图、公告跑马灯、图片滚动，选项卡内容切换、手风琴折叠效果等。兼容 IE6+ Safari Opera Firefox Chrome 等大部分浏览器。

代码标签： jquery.agilebins下拉菜单幻灯片滚动示例代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <style>
        @charset "utf-8";

    
    html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, code, del, dfn, em, img, q, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
        margin: 0;
        padding: 0;
        border: 0;
        font-weight: inherit;
        font-style: inherit;
        font-size: 100%;
        font-family: inherit;
        vertical-align: baseline;
    }
    table {
        border-collapse: collapse;
        border-spacing: 0;
    }
    p {
        word-wrap: break-word;
    }
    em, i {
        font-style: normal;
    }
    li {
        list-style: none;
    }
    img {
        border: 0;
        vertical-align: middle;
    }
    h1, h2, h3, h4, h5, h6 {
        font-weight: 100;
    }
    .clearfix:before, .clearfix:after {
        content: "";
        display: table;
    }
    .clearfix:after {
        clear: both;
    }
    .clearfix {
        zoom: 1;
    }
    .clear {
        height: 0;
        clear: both;
        overflow: hidden;
    }
    body {
        background: #0c91e8;
        color: #0B9BCA;
        font: 14px/24px "microsoft yahei", "SimHei", "SimSun";
        -webkit-text-size-adjust: 100%;
    }
    a {
        color: #39c;
        text-decoration: none;
    }
    a:hover {
        color: #9a5b00;
        text-decoration: none;
    }
    .demo-js-area {
        margin: 60px auto 80px auto;
        width: 750px;
        font-size: 14px;
        color: #29c;
    }
    .codecont {
        width: 700px;
        text-align: left;
        font-family: "Lucida Console", Monaco, monospace, "SimSun";
        background: #323232;
        padding: 30px;
        border-radius: 30px;
    }
    .codecont p {
        font-size: 14px;
        height: 21px;
        line-height: 21px;
        overflow: hidden;
    }
    .codecont .html_line {
        font-size: 12px;
        font-style: italic;
        width: 30px;
        height: 21px;
        float: left;
        color: #3f5f72;
        user-select: none;
        border-right: 1px solid #2b414e;
        overflow: hidden;
    }
    .codecont .html_size {
        color: #50595d;
        font-size: 12px;
        padding-left: 50px;
        user-select: none;
    }
    .codecont .html_name {
        color: #37c;
    }
    .codecont .html_tit {
        color: #377;
    }
    .codecont .script_tag {
        color: #c55;
    }
    .codecont .script_tag2 {
        color: #36c;
        font-weight: bold;
    }
    .codecont .href_tag {
        color: #3c3;
    }
    .codecont .img_tag {
        color: #c3c;
    }
   
   
    .topnav {
        float: right;
        padding-right: 20px;
        position: relative;
    }
    .topnav li {
        float: left;
        font-size: 14px;
        overflow: hidden;
    }
    .topnav li a {
        text-decoration: none;
        color: #eef7fe;
        padding: 0 10px;
        display: block;
    }
    .topnav li a:hover {
        color: #fff;
    }
    .demo-main {
        width: 100%;
        padding: 100px 0 200px 0;
        margin: 0 auto;
    }
    .demo-tit {
        text-align: center;
        font-size: 34px;
        height: 240px;
        line-height: 240px;
        font-weight: 700;
        letter-spacing: .03em;
        color: #ddf0fb;
    }
    .demo-tit a {
        font-size: 32px;
        height: 160px;
        line-height: 160px;
        font-weight: 100;
        color: #fff;
        margin: 50px;
    }
    .demo-tit a:hover {
        color: #4ad585;
    }
    /* 导航演示 */
     .demo-nav {
        width: 1000px;
        margin: 0 auto;
        height: 50px;
        background: #fff;
        border-radius: 50px;
    }
    .demo-nav .one {
        padding-left: 50px;
    }
    .demo-nav .conts {
        position: relative;
        float: left;
        line-height: 50px;
        padding: 0 30px;
    }
    .demo-nav h3 {
        font-size: 16px;
        font-weight: 700;
    }
    .demo-nav h3 a {
        color: #39c;
    }
    .demo-nav h3 a:hover {
        color: #fff;
        text-decoration: none;
    }
    .demo-nav .on {
        background: #3c3;
    }
    .demo-nav .on a {
        color: #fff;
    }
    .demo-nav .on a:hover {
        color: #fff;
        text-decoration: none;
    }
    .demo-nav .sub {
        display: none;
        text-align: center;
        width: 120px;
        background-color: #3c3;
    }
    .demo-nav .sub ul {
        padding: 20px 0;
    }
    .demo-nav .sub li {
        color: #fff;
        text-align: center;
        font-size: 14px;
        line-height: 28px;
    }
    .demo-nav .sub li a {
        color: #fff;
    }
    .demo-nav .sub li a:hover {
        color: #fff;
        text-decoration: underline;
    }
    /* 图文左右滚动 */
     .domo-pic-scroll-lr {
        width: 1050px;
        height: 150px;
        position: relative;
        margin: 0 auto;
    }
    .domo-pic-scroll-lr .conts li a {
        color: #39c;
        display: block;
        width: 200px;
        height: 120px;
        background: #fff;
    }
    .domo-pic-scroll-lr ..........完整代码请登录后点击上方下载按钮下载查看