样式 global.css
@charset "utf-8";
/* CSS Document */
* {
margin: 0px;
padding: 0px;
font-size: 12px;
line-height: 20px;
color: #333;
}
ul, li, ol, h1, dl, dd {
list-style: none;
margin: 0px;
padding: 0px;
}
a {
color: #333333;
text-decoration: none;
}
a:hover {
color: #333333;
text-decoration: underline;
}
img {
border: 0px;
}
.blue {
color: #1965b3;
text-decoration: none;
}
.blue:hover {
color: #1965b3;
text-decoration: underline;
}
#main {
width: 960px;
margin: 0px auto 0px auto;
clear: both;
float: none;
}
#header, #footer {
width: 100%;
}
#header {
width: 100%;
background: -webkit-linear-gradient(#fff, #f3f3f3);
background: -o-linear-gradient(#fff, #f3f3f3);
background: -moz-linear-gradient(#fff, #f3f3f3);
background: linear-gradient(#fff, #f3f3f3);
height: 30px;
line-height: 30px;
overflow: hidden;
}
.search {
float: left;
margin-left: 15px;
margin-top: 20px;
}
.search input[type=text] {
width: 600px;
height: 30px;
border: 2px solid #49bafc;
float: left;
}
.search input[type=button] {
background: url("../images/search.jpg") no-repeat;
width: 124px;
height: 36px;
overflow: hidden;
border: none;
}
#nav {
width: 100%;
background: #49bafc;
height: 38px;
clear: both;
}
#nav ul {
width: 960px;
margin: 0 auto;
}
#nav ul li {
float: left;
text-align: center;
width: 120px;
}
#nav ul li:first-of-type {
width: 180px;
}
#nav ul li a {
color: #ffffff;
font-size: 16px;
font-weight: bold;
line-height: 38px;
display: block;
}
#nav ul li a:hover {
background: #2487c1;
}
layout.css
@charset "utf-8";
/* CSS Document */
/*首页样式*/
/*右侧随鼠标滚动的广告图片*/
.right{
top:50px;
right:30px;
position:absolute;
z-index:3;
}
.dd_close{
width:35px;
height:18px;
text-align:center;
border:solid 1px #999;
background-color:#E0E0E0;
top:0px;
right:0px;
position:absolute;
}
#catList,#content,#silder{
float:left;
}
#catList{
width:180px;
margin-right:10px;
margin-top:5px;
}
#content{
width:540px;
margin-right:10px;
}
#silder{
width:220px;
margin-top:5px;
}
.book_sort{
border:solid 1px #999;
margin-bottom:10px;
}
.book_sort_bg{
background-color:#d7eff8;
padding-left:10px;
color:#207291;
font-size:14px;
height:28px;
font-weight:bold;
line-height:30px;
}
.book_sort_bottom{
margin:0px 10px 0px 10px;
line-height:25px;
}
.book_cate{
padding:10px 0px 0px 10px;
font-weight:bold;
}
.scroll{
width:540px;
height:200px;
overflow:hidden;
padding:5px 0 5px 0;
position:relative;
}
.scroll img{width: 540px;}
.scroll #scroll_img li{
margin-bottom:20px;
}
#scroll_number{
right:0;
padding-right:5px;
position:absolute;
bottom:10px;
}
#scroll_number li{
width:28px;
height:28px;
border-radius: 50%;
text-align:center;
color: #fff;
margin-left:5px;
float: left;
font-size:16px;
font-weight: bold;
line-height:26px;
cursor:pointer;
background: #a9a9a9;
}
.scroll_number_out{
}
#scroll_number .scroll_number_over{
background: #9b2d30;
color:#FFF;
}
#dome{
overflow:hidden; /*溢出的部分不显示*/
height:160px;
padding:5px;
}
/*网页版权部分样式开始*/
.footer_end{
width:800px;
margin:0px auto 0px auto;
clear:both;
text-align:center;
}
.footer_top{
clear:both;
text-align:center;
height: 35px;
line-height: 35px;
background: #4db3f5;
color: #fff;
}
.footer_top a,.footer_top a:hover{color: #fff; font-weight: bold;
}
.footer_dull_red,.footer_dull_red:hover{
color:#06516d;
margin:0px 8px 0px 8px;
}
/*网页版权部分样式结束*/
/*当当网商品展示页样式开始*/
.current_place{
padding-left:10px;
clear:both;
height:30px;
}
#product_left{
width:180px;
float:left;
}
#product_catList{
border:solid 1px #d3d3d3;
background-color:#dff1f7;
}
#product_catList a{color: #000000;}
.product_catList_top{
color:#FFF;
height:23px;
font-size:14px;
padding-left:10px;
background-image:url(../images/product_left_top_bg.jpg);
background-repeat:repeat-x;
line-height:28px;
margin-bottom:10px;
}
#product_catList_class li{
height:25px;
padding-left:10px;
}
.product_catList_end{
border:solid 1px #d3d3d3;
margin:10px 0px 10px 0px;
text-align:center;
}
#product_storyList{
border:solid 1px #a1a1a1;
float:right;
width:770px;
margin-bottom:20px;
}
#product_storyList_top{
background-color:#dff1f7;
border-bottom:solid 1px #a1a1a1;
height:30px;
}
#product_storyList_top li{
float:left;
line-height:28px;
padding-left:5px;
}
#product_storyList_top img{
padding-top:5px;}
#product_array{
background-color:#dff1f7;
border-bottom:solid 1px #a1a1a1;
height:30px;
padding-right:15px;
}
#product_array a{
line-height:22px;
margin-right:0px;
margin-top:5px;
padding:0 5px;
float:right;
background:none;
border:#808080 1px solid;
}
#product_array a.click{
background:#F96;
border:#F04E23 1px solid;
}
.product_storyList_content{
margin:20px 10px 20px 10px;
}
.product_storyList_content .big_img_list{
width:25%;
height:240px;
background:#fff;
float:left;
overflow:hidden;
text-align:left;
margin:10px auto;
position:relative;
}
.product_storyList_content .big_img_list.over{
overflow:visible;
z-index:99;
}
.product_storyList_content .big_img_list ul{
background:#fff;
padding:0 5px 5px;
}
.product_storyList_content .big_img_list ul.over{
border:2px solid #F96;
position:absolute;
z-index:99;
}
.product_storyList_content .big_img_list li{
padding:2px 5px;
font-size:12px;
}
.product_storyList_content .big_img_list li a{
padding:2px 10px;
font-size:12px;
}
.product_storyList_content .big_img_list .bookImg img{
width:150px;
height:150px;
}
.product_storyList_content .big_img_list dl{
width:100%;
overflow:hidden;
}
.product_storyList_content .big_img_list dl dd{
float:left;
margin-left:10px;
}
.product_storyList_content_bottom{
border-bottom:1px solid #666;
clear:both;
margin-bottom:20px;
}
.product_storyList_content_left{
width:100px;
text-align:center;
float:left;
}
.product_storyList_content_right{
float:left;
width:640px;
}
.product_storyList_content_dash{
border-bottom:dashed 1px #666;
}
.blue_14{
color:#1965b3;
font-size:14px;
text-decoration:none;
}
.blue_14:hover{
color:#1965b3;
text-decoration:underline;
font-size:14px;
}
.product_content_dd dd{
float:right;
padding-right:10px;
}
.product_content_delete{
text-decoration:line-through;
}
#product_page li{
float:left;
}
.product_page{
width:18px;
height:18px;
text-decoration:none;
float:left;
display: block;
background-color:#FC6;
margin:0px 3px 1px 0px;
text-align:center;
}
.product_page:hover{
width:18px;
height:18px;
text-decoration:none;
float:left;
background-color:#900;
margin:0px 3px 1px 0px;
color:#FFF;
}
/*购物车页面样式开始*/
.shopping_commend{
background-image:url(../images/shopping_commend_bg.gif);
background-repeat:repeat-x;
height:21px;
border:solid 1px #999;
}
.shopping_commend_left{
float:left;
padding-left:10px;
}
.shopping_commend_right{
float:right;
padding-right:10px;
margin-top:3px;
}
.shopping_commend_right img{
cursor:pointer;
}
#shopping_commend_sort{
border:solid 1px #999;
border-top:0;
padding:5px 20px 5px 20px;
height:120px;
}
.shopping_commend_sort_left{
float:left;
width:450px;
}
.shopping_commend_sort_mid{
float:left;
width:15px;
background-image:url(../images/shopping_dotted.gif);
background-repeat:repeat-y;
height:120px;
}
.shopping_commend_list_1,.shopping_commend_list_2,.shopping_commend_list_3,.shopping_commend_list_4{
float:left;
height:30px;
line-height:30px;
}
.shopping_commend_list_1{
width:240px;
}
.shopping_commend_list_2{
width:70px;
text-align:center;
text-decoration:line-through;
color:#999;
}
.shopping_commend_list_3{
width:70px;
text-align:center;
}
.shopping_commend_list_4{
text-align:center;
width:65px;
}
.shopping_yellow{
color:#ED610C;
}
.shopping_yellow:hover{
color:#ED610C;
text-decoration:underline;
}
.shopping_list_top{
clear:both;
font-size:14px;
font-weight:bold;
margin-top:20px;
}
.shopping_list_border{
border:solid 2px #999;
}
.shopping_list_title{
background-color:#d5edf6;
height:25px;
}
.shopping_list_title li{
float:left;
line-height:28px;
}
.shopping_list_title_1{
width:420px;
padding-left:30px;
text-align:left;
}
.shopping_list_title_2{
width:120px;
text-align:center;
}
.shopping_list_title_3{
width:120px;
text-align:center;
}
.shopping_list_title_4{
width:120px;
text-align:center;
}
.shopping_list_title_5{
width:70px;
text-align:center;
}
.shopping_list_title_6{
width:70px;
text-align:center;
}
.shopping_product_list{
background-color:#fefbf2;
height:40px;
}
.shopping_product_list input{
width:30px;
height:15px;
border:solid 1px #666;
text-align:center;
}
.shopping_product_list td{
line-height:35px;
border-bottom:dashed 1px #CCC;
}
.shopping_product_list_1{
width:420px;
padding-left:30px;
text-align:left;
}
.shopping_product_list_2{
width:120px;
text-align:center;
color:#464646;
}
.shopping_product_list_3{
width:120px;
text-align:center;
color:#464646;
}
.shopping_product_list_4{
width:120px;
text-align:center;
color:#191919;
}
.shopping_product_list_5{
width:70px;
text-align:center;
}
.shopping_product_list_6{
width:70px;
text-align:center;
}
.shopping_list_end{
background-color:#d5edf6;
height:84px;
}
.shopping_list_end li{
float:right;
}
.shopping_list_end_1{
margin:10px 10px 0px 10px;
}
.shopping_list_end_2{
font-weight:bold;
color:#BD3E00;
font-size:14px;
margin:15px 10px 0px 0px;
}
.shopping_list_end_3{
font-weight:bold;
font-size:14px;
margin:15px 0px 0px 15px;
}
.shopping_list_end_4{
border-right:solid 1px #666666;
margin:10px 0px 0px 15px;
padding-right:10px;
}
.shopping_list_end_yellow{
color:#BD3E00;
}
.shopping_list_end #removeAllProduct{
line-height:24px;
padding:0 5px;
margin-left:20px;
color:#1965B3;
}
.empty_product{
height:150px;background:#ffffff url(../images/emptyShopping.jpg) 300px 40px no-repeat;font-size:16px;text-align:center;position:relative;
}
.empty_product div{
padding-top:60px;
}
.empty_product a{
color:#1965B3;
}
/*注册页面样式*/
#register_header{
height:48px;
}
.register_header_left{
float:left;
margin:7px 0px 0px 40px;
display:inline;
}
.register_header_right{
float:right;
margin:25px 20px 0px 0px;
display:inline;
}
.register_content{
width:950px;
margin:15px auto 15px auto;
border-radius: 5px;
border: 1px solid #a3a3a3;
}
.register_mid_bg{
border-bottom:dashed 1px #a3a3a3;
border-top:0px;
height:50px;
padding-left: 20px;
font-size: 18px;
font-weight: bold;
line-height: 50px;
}
.register_message{
width:900px;
padding-top: 15px;
}
.register_row{
clear:both;
}
.register_row dt{
float:left;
width:200px;
height:30px;
text-align:right;
font-size:14px;
}
.register_row dd{
float:left;
margin-right:5px;
display:inline;
}
.register_input{
width:200px;
height:18px;
border:solid 1px #999;
margin:0px 0px 8px 0px;
}
.registerBtn{
height:35px;
margin:10px 0px 10px 200px;
clear:both;
}
/*登录页面样式*/
.login_header_left{
float:left;
margin:30px 10px 0px 100px;
}
.login_header_right{
float:right;
margin:50px 60px 0px 0px;
}
.login_main_left{
float:left;
padding: 15px 0 0 120px;
}
.login_main_left img{
float:left;
border:0px;
}
.login_main_dotted{
float:left;
background-image:url(../images/shopping_dotted.gif);
width:1px;
height:90px;
margin:20px 15px 20px 15px;
}
.login_main_mid{
border:solid 1px #666;
float:right;
width:320px;
padding:10px 5px 10px 5px;
margin: 15px 100px 0 0;
}
.login_main_right{
float:left;
width:74px;
}
.login_main_right img{
border:0px;
}
.login_content_top{
background-image:url(../images/login_icon_bg_01.gif);
background-position:-300px -30px;
background-repeat:no-repeat;
padding:10px 0px 0px 35px;
font-weight:bold;
font-size:14px;
color:#069dd5;
border-bottom: 1px dashed #a9a9a9;
margin-bottom: 30px;
}
.login_content{
clear:both;
margin:10px 0px 0px 0px;
}
.login_content dt{
font-size:14px;
height:30px;
text-align:right;
width:150px;
float:left;
}
.login_content dd{
float:left;
}
.login_content_input{
width:120px;
height:16px;
border:solid 1px #999;
}
.login_content_input_Focus{
background-color:#f1ffde;
width:120px;
height:16px;
border:solid 1px #999;
}
.login_btn_out{
background-image:url(../images/login_icon_bg_01.gif);
background-position:0px -30px;
background-repeat:no-repeat;
width:77px;
height:26px;
border:0px;
cursor:pointer;
}
.login_btn_over{
background-image:url(../images/login_icon_bg_01.gif);
background-position:-78px -30px;
background-repeat:no-repeat;
width:77px;
height:26px;
border:0px;
cursor:pointer;
}
.login_content_end_bg{
padding:20px 20px 20px 20px;
}
.login_content_end_bg_top{
clear:both;
padding: 20px 0;
line-height: 28px;
}
.login_content_bold{
font-weight:bold;
color:#333;
}
.login_content_end_bg_end{
clear:both;
text-align:right;
padding:10px;
}
.login_register_out{
background-image:url(../images/login_icon_bg_01.gif);
background-position:0px -3px;
background-repeat:no-repeat;
width:144px;
height:26px;
border:0px;
cursor:pointer;
}
.login_register_over{
background-image:url(../images/login_icon_bg_01.gif);
background-position:-144px -3px;
background-repeat:no-repeat;
width:144px;
height:26px;
border:0px;
cursor:pointer;
}
.book{width: 710px; clear: left; margin-bottom: 10px;
float: left;}
.book h1{height: 40px; font-size: 16px;
clear: both; line-height: 50px;
overflow: hidden;
border-bottom: 2px #000000 solid;
margin-bottom: 10px;
}
.book ul{width: 100%;
overflow: hidden;
border-top: 1px #cccccc solid;
border-right: 1px #cccccc solid;
}
.book ul li{float: left;width: 235px; height: 220px; overflow: hidden; text-align: center;
border-left: 1px #cccccc solid;
border-bottom: 1px #cccccc solid;}
.book ul li img{width: 80%;}
.tab{
width: 238px;
border: 1px #ccc solid;
float: right;
height: 495px;
overflow: hidden;
}
.tab ol li{float: left; background: #ffffff; width:119px; height: 35px; line-height: 35px; overflow: hidden; text-align: center;}
.tab ol li:last-of-type{
background:#efefef;border-left:1px solid #cccccc;border-bottom:1px solid #ccc;width:118px;
}
.two{
background:#efefef;border-left:1px solid #cccccc;border-bottom:1px solid #ccc;width:118px;
}
.tab ul{clear: both; width: 100%;}
.tab ul li{clear: both;}
.tab ul li span{display: block; width: 25px; color: #999999; float: left; text-align: center; font-weight: bold; line-height: 35px;}
.tab ul li p{height: 35px; overflow: hidden; border-bottom: 1px #ccc solid; float: left; width: 213px; line-height: 35px;}
.tab ul li dl{border-bottom: 1px #ccc solid; float: left; width: 213px; height: 130px; overflow: hidden; display: none; padding-top: 5px;}
.tab ul li dl dt{float: left; width: 90px;}
.tab ul li dl dt img{width: 90px;}
.tab ul li dl dd{float: left; width:120px; }
.tab ul:last-of-type{display: none;}
.tab ul li:last-of-type p,.tab ul li:last-of-type dl{border-bottom: none;}
.tab ul li:first-of-type p{display: none;}
.tab ul li:first-of-type dl{display: block;}
template.css
@charset "utf-8";
/* CSS Document */
/*网页头部导航样式开始*/
.header_top,.header_middle,.header_search{
margin-left:auto;
margin-right:auto;
width:955px;
clear:both;
}
.header_top_left{
float:left;
width:260px;
padding-left:10px;
line-height:28px;
}
.header_top_right{
float:right;
padding-right:10px;
width:400px;
text-align:right;
}
.header_top_right li{
float:right;
margin-left:5px;
margin-top:5px;
}
.logo,.menu_left,.menu_right{
float:left;
}
.logo{
width:155px;
padding-top:13px;
height:47px;
}
.menu_left{
height:28px;
margin-top:32px;
line-height:35px;
width:510px;
border: 1px #a1a1a1 solid;
border-bottom: none;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
background: #fbfbfb;
}
.menu_left ul li{
float:left;
height:28px;
padding:0px 3px 0px 3px;
}
.bold,.bold:hover{
font-weight:bold;
}
.menu_right{
margin-top:32px;
height:28px;
}
#menu_dull_red li{
float:left;
margin-left:5px;
text-align:center;
line-height:35px;
height:28px;
background: #d5edf6;
border: 1px solid #3abbeb;
border-bottom: none;
border-top-left-radius: 5px;
border-top-right-radius: 5px;
padding: 0 4px;
}
#menu_dull_red a,#menu_dull_red:hover{
color:#127da5;
text-decoration:none;
font-weight:bold;
}
.menu{
clear:both;
background:#1eb2e9;
height:27px;
line-height:28px;
text-align:center;
color:#FFF;
border-radius: 5px;
}
#menu_white{
float:left;
}
.menu_mid_white,.menu_mid_white:hover{
color:#FFF;
padding:0px 4px 0px 4px;
}
.header_search{
margin-top:0px;
height:35px;
border: 1px #a1a1a1 solid;
border-radius: 5px;;
background: #fbfbfb;
}
#header_serach_mid_menu li{
float:left;
margin-top:6px;
padding:0px 5px 0px 5px;
line-height:25px;
}
.header_input_search{
margin-left:15px;
width:200px;
height:18px;
}
/*网页头部导航样式结束*/
/*网页版权部分样式开始*/
.footer_end{
width:800px;
margin:0px auto 0px auto;
clear:both;
text-align:center;
}
/*网页版权部分样式结束*/
/*导航部分下拉菜单样式*/
#dd_menu_top_down{
position:absolute;
width:80px;
text-align:left;
border:solid 1px #999;
border-top:0px;
display:none;
background-color:#FFF;
padding-left:10px;
}
#dd_menu_top_down li{
float:none;
}
代码
index.htm
l
蔚蓝网首页
图书商品分类
悬疑 | 言情 | 职场 | 财经
文学 | 传记 | 艺术 | 摄影
青春文学 | 动漫 | 幽默
修养 | 成功 | 职场 | 沟通
0-2 | 3-6 | 7-10 | 11-14
教材 | 中小学教辅 | 外语
书讯快递
・2010考研英语大纲到货75折...
・权威定本四大名著（人民文...
・口述历史权威唐德刚先生国...
・袁伟民与体坛风云：实话实...
・我们台湾这些年：轰动两岸...
・畅销教辅推荐：精品套书50...
・2010版法律硕士联考大纲75...
・计算机新书畅销书75折抢购
・2009年孩子最喜欢的书>>
・弗洛伊德作品精选集59折
・2010考研英语大纲到货75折...
・权威定本四大名著（人民文...
・口述历史权威唐德刚先生国...
・袁伟民与体坛风云：实话实...
・我们台湾这些年：轰动两岸...
・畅销教辅推荐：精品套书50...
・2010版法律硕士联考大纲75...
・计算机新书畅销书75折抢购
・2009年孩子最喜欢的书>>
・弗洛伊德作品精选集59折
・2010考研英语大纲到货75折...
・权威定本四大名著（人民文...
・口述历史权威唐德刚先生国...
・袁伟民与体坛风云：实话实...
・我们台湾这些年：轰动两岸...
・畅销教辅推荐：精品套书50...
・2010版法律硕士联考大纲75...
・计算机新书畅销书75折抢购
・2009年孩子最喜欢的书>>
・弗洛伊德作品精选集59折
・2010考研英语大纲到货75折...
・权威定本四大名著（人民文...
・口述历史权威唐德刚先生国...
・袁伟民与体坛风云：实话实...
・我们台湾这些年：轰动两岸...
・畅销教辅推荐：精品套书50...
・2010版法律硕士联考大纲75...
・计算机新书畅销书75折抢购
・2009年孩子最喜欢的书>>
・弗洛伊德作品精选集59折
图书畅销榜
图书上新书榜
1
追风筝的人
追风筝的人 中文版，快乐大本营高圆圆感动推荐，奥巴马送给女儿的新年礼物
2
解忧杂货店
解忧杂货店 《白夜行》后东野圭吾备受欢迎作品：不是推理小说，却更扣人心弦
3
天才在左疯子在右
天才在左疯子在右 新增10个被封杀篇章！看高智商疯子如何调戏和羞辱正常人！继高圆圆后，女神陈乔恩芒果台盛情推荐！
4
白夜行
白夜行 东野圭吾推理小说无冕之王。全新精装典藏版
5
阮/陈恩静 吕亦涵 著
阮/陈恩静 吕亦涵 著 商战风云诡谲X情场暗潮汹涌。这一生幸运的是—— 以你之名，冠我之姓
6
摆渡人
摆渡人 畅销欧美33个国家，荣获多项图书大奖。如果命运是一条孤独的河流，谁会是你灵魂的摆渡人？如果我真的存在，也是因为你需要我。
7
岛上书店
岛上书店 每个人的生命中，都有无比艰难的那一年，将人生变得美好而辽阔
8
百年孤独
百年孤独 加西亚马尔克斯代表作，中文版首次授权！
9
我们仨
我们仨 《我们仨》是杨绛先生撰写的家庭生活回忆录，三联书店出版，影响几代人的作品，杨绛先生经典散文！
10
从你的全世界路过
从你的全世界路过 从你的全世界路过 2014中国好书榜获奖图书
1 好吗好的
好吗好的 凡8月12日20:00前下单顾客，100%有大冰亲笔签名，之后下单顾客先到先得签名。各仓到货时间不一致，请各位耐心等待。2 永无止尽的约会
永无止尽的约会 永无止尽的约会3 你的坚持，终将美好
你的坚持，终将美好 无论正在经历什么，都请你不要轻言放弃，因为从来没有一种坚持会被辜负4 茧
茧 阔别十年，张悦然与我们再度重逢。真正的爱，是知道爱你有多困难还选择爱你；真正的长大，是知道生活的真相还热爱生活5 就喜欢你看不惯我
就喜欢你看不惯我 霸气吾皇率蠢萌巴扎黑、伪深邃的牛能强势归来！6 遇见美好系列
遇见美好系列 全8册，3-7岁心灵成长绘本。7 八万四千问
八万四千问 宗萨蒋扬钦哲仁波切四年来首部作品：“佛法能够解决你们的所有问题。8 极简生活：简而美地活
极简生活：简而美地活 极简是风靡全球的一种生活态度与理念。告别繁杂，拥有简而美的生活。9 好妈妈胜过好老师
好妈妈胜过好老师 好妈妈胜过好老师2：自由的孩子最自觉10 我们始终独自行走在这个世界
我们始终独自行走在这个世界 十点读书、二更食堂、清华南都等各大微信阅读平台，简书、豆瓣千万读者口碑相传作品。
login.html
蔚蓝网登录页面
open.html
弹出广告窗口
product.html
蔚蓝网商品展示页面
排序方式
按销量 降序
按价格 升序
按价格 降序
按折扣 升序
按折扣 降序
按出版时间 升序
按出版时间 降序
按上架时间 升序
按上架时间 降序
每页显示的数量
第1页
register.html
蔚蓝网注册页面
shopping.html
蔚蓝网购物车页面
js
header.js
/**
* Created by Administrator on 2019/7/6.
*/
//鼠标停在或移除"新手入门"时，显示菜单
$("#menu a").mouseenter(function () {
$("#dd_menu_top_down").slideDown("slow");
}).mouseleave(function () {
$("#dd_menu_top_down").slideUp("slow");
});
//滚动广告
var adverTop = parseInt($("#right").css("top"));
var adverLef = parseInt($("#right").css("left"));
$(window).scroll(function () {
var scrollTop = parseInt($(this).scrollTop());//获取滚动条滚下去的距离
var scrollLef = parseInt($(this).scrollLeft());//获取滚动条滚向右的距离
$("#right").offset({top: scrollTop + adverTop});
$("#right").offset({left: scrollLef + adverLef});
});
//关闭滚动广告
$("#dd_close a").click(function () {
$("#right ").hide();
})
//图书畅销榜
$(".tab ol li :first").mouseover(function () {
$(this).css({background: "#ffffff", "border": "none"});
$(".tab ol li:last").css({
background: "#efefef",
"border-left": "1px solid #cccccc",
"border-bottom": "1px solid #ccc",
"width": "118px"
})
$(".tab ul:first").show();//隐藏
$(".tab ul:last").hide();//显示
})
$(".tab ol li :last").mouseover(function () {
$(this).css({background: "#ffffff", "border": "none"});
$(".tab ol li:first").css({
background: "#efefef",
"border-right": "1px solid #cccccc",
"border-bottom": "1px solid #ccc",
"width": "118px"
})
$(".tab ul:first").hide();//隐藏
$(".tab ul:last").show();//显示
});
$(".tab ul li").mouseenter(function () {
//1.把当前li所有的兄弟li的dl隐藏、p显示
$(this).parent().children("li").children("dl").hide();
$(this).parent().children("li").children("p").show();
//2.把当前的li的dl显示，p隐藏
$(this).children("dl").show();
$(this).children("p").hide();
});
//书讯快递
var marginTop = 0;
var book = setInterval(interval, 100);
function interval() {
$("#express").children("li").first().animate({"margin-top": marginTop--}, 0, function () {
var $first = $(this);
if ($first.is(":animated") == false) {
if ((-marginTop) > $first.height()) {
$first.css({"margin-top": 0}).appendTo($("#express"));
marginTop = 0;
}
}
});
}
$("#express li").hover(function () {
clearInterval(book);
}, function () {
book = setInterval(interval, 100);
});
//广告轮播图
var num = 0;
setInterval(function () {
//判断图片是否已经全部切换完，切换完重新开始
$("#scroll_number li").mouseover(function () {
num = $(this).index();
$("#scroll_img li").eq(num).fadeIn("slow").siblings().fadeOut("slow");
$("#scroll_number li:eq(" + num + ")").css("background", "red").siblings().css("background", "#a9a9a9");
})
$("#scroll_img li").eq(num).fadeIn("slow").siblings().fadeOut("slow");
$("#scroll_number li").eq(num).css("background", "red").siblings().css("background", "#a9a9a9");
if (num == 3) {
num = 0;
} else {
num++;
}
}, 2000);
index.js
/**
* Created by Administrator on 2019/7/6.
*/
//广告页面弹窗
function open_adv() {
window.open("open.html", "", "height=350,width=520,left=50,top=100");
}
//电子书特效
$(".book ul li img ").mouseover(function(){
$(this).animate({"width":"240px"});
}).mouseout(function(){
$(this).animate({"width":"60%"});
});
register.js
/**
* Created by Administrator on 2019/7/9.
*/
图书商品分类
书讯快递
