求助,请问下面代码哪里有问题
时间:2009-10-12
来源:互联网
新手写的代码也不知道问题出在哪里
想要的效果参照http://www.china-pub.com/sale/usedbook.aspx右边热门二手书效果
下面我贴出我写的代码
各们大哥大姐帮帮手,指点俺一下,十分感谢!
<!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>无标题文档</title>
<style type="text/css">
<!--
.con {
height: auto;
width: 520px;
}
div.hover , div.click{
padding:0px;
margin:0px;
}
div.hover>label , div.click>label{
float:left;
display:block;
line-height:22px;
padding:0px 3px;
margin:0px;
}
div.hover>label.select , div.click>label.select{
background:#EEE;
border:1px solid #CCC;
border-bottom:none;
}
div.hover>div , div.click>div{
display:none;
}
div.show{
display:block;
clear:both;
padding:0px;
margin:0px;
border:1px solid #CCC;
background:#EEE;
}
/*设计师,公司排名样式*/
.slideList{
height: auto;
width: 500px;
}
.default{
padding-top:6px;
height:20px;
}
.default p{
float:left;
font-size:13px;
}
.default p.rank{
padding-left:4px;
width:30px;
background:url(../images/indexIcon4.gif) no-repeat -312px -233px;
color:#000;
}
.default p.city{
float:right;
width:190px;
color:#666;
}
.default p.city span{
color:#d10031;
}
.active{
padding:3px;
height:80px;
border:1px solid #f0d500;
display:none;
}
.active .photo{
float:left;
display:inline;
margin-right:10px;
width:76px;
}
.active .photo a img{
padding:1px;
width:72px;
height:76px;
border:1px solid #f0d500;
}
.active .photo a:hover img{
border-color:#c1002f;
}
.active p{
line-height:220%;
}
.active p span{
color:#c1002f;
}
-->
</style>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
<!--
$(function($){
$('div.hover,div.click').each(function(i){
$(this).children('label:first').addClass('select');
$(this).next('div').html($(this).children('div:first').html())
});
$('div.hover label').hover(function(){
$(this).addClass('select').siblings('label').removeClass('select').parents('div.hover').next('div:first').html($(this).next('div:first').html())
},function(){});
$('div.click label').click(function(){
$(this).addClass('select').siblings('label').removeClass('select').parents('div.click').next('div:first').html($(this).next('div:first').html())
},function(){});
})
$(function($){
$(function(){
$('.default:first').hide();
$('.active:first').show();
});
$('.slideList').hover(function(){
$(this).children('.default').hide();
$(this).children('.active').show();
$(this).siblings().children('.default').show();
$(this).siblings().children('.active').hide();
},function(){
$(this).children('.default').hide();
$(this).children('.active').show();
});
})
//-->
</script>
</head>
<body>
<div class="con">
<div class="hover">
<label>设计师排名</label>
<div class="div_h_auto">
<div class="slideList">
<div class="active">
<div class="photo"><a href="#" ><img src="#" /></a></div>
<p><span>设计师:</span><a href="#" >壮壮</a></p>
<p>为您打造一个温馨舒适的家是我最大的心愿!</p>
<div class="clear"></div>
</div>
<div class="default">
<p class="rank">1</p>
<p><a href="#" >壮壮</a></p>
<p class="city"><span>专长:</span>住宅公寓 别墅 办公楼 </p>
<div class="clear"></div>
</div>
</div>
<div class="slideList">
<div class="active">
<div class="photo"><a href="#" ><img src="#" /></a></div>
<p><span>设计师:</span><a href="#" >壮壮</a></p>
<p>为您打造一个温馨舒适的家是我最大的心愿!</p>
<div class="clear"></div>
</div>
<div class="default">
<p class="rank">2</p>
<p><a href="#" >壮壮</a></p>
<p class="city"><span>专长:</span>住宅公寓 别墅 办公楼 </p>
<div class="clear"></div>
</div>
</div>
</div>
<label>装饰公司排名</label>
<div class="div_h_auto">
<ul>
<li><a href="2009/0816/7919.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7918.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7917.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7919.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7918.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7917.html" target="_blank">继续测试中做呢!</a></li>
</ul>
</div>
<label>工作室排名</label>
<div class="div_h_auto">
<ul>
<li><a href="2009/0816/7919.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7918.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7917.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7919.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7918.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7917.html" target="_blank">继续测试中做呢!</a></li>
</ul>
</div>
</div>
<div class="show">Loading...</div>
</div>
</body>
</html>
想要的效果参照http://www.china-pub.com/sale/usedbook.aspx右边热门二手书效果
下面我贴出我写的代码
各们大哥大姐帮帮手,指点俺一下,十分感谢!
<!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>无标题文档</title>
<style type="text/css">
<!--
.con {
height: auto;
width: 520px;
}
div.hover , div.click{
padding:0px;
margin:0px;
}
div.hover>label , div.click>label{
float:left;
display:block;
line-height:22px;
padding:0px 3px;
margin:0px;
}
div.hover>label.select , div.click>label.select{
background:#EEE;
border:1px solid #CCC;
border-bottom:none;
}
div.hover>div , div.click>div{
display:none;
}
div.show{
display:block;
clear:both;
padding:0px;
margin:0px;
border:1px solid #CCC;
background:#EEE;
}
/*设计师,公司排名样式*/
.slideList{
height: auto;
width: 500px;
}
.default{
padding-top:6px;
height:20px;
}
.default p{
float:left;
font-size:13px;
}
.default p.rank{
padding-left:4px;
width:30px;
background:url(../images/indexIcon4.gif) no-repeat -312px -233px;
color:#000;
}
.default p.city{
float:right;
width:190px;
color:#666;
}
.default p.city span{
color:#d10031;
}
.active{
padding:3px;
height:80px;
border:1px solid #f0d500;
display:none;
}
.active .photo{
float:left;
display:inline;
margin-right:10px;
width:76px;
}
.active .photo a img{
padding:1px;
width:72px;
height:76px;
border:1px solid #f0d500;
}
.active .photo a:hover img{
border-color:#c1002f;
}
.active p{
line-height:220%;
}
.active p span{
color:#c1002f;
}
-->
</style>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
<!--
$(function($){
$('div.hover,div.click').each(function(i){
$(this).children('label:first').addClass('select');
$(this).next('div').html($(this).children('div:first').html())
});
$('div.hover label').hover(function(){
$(this).addClass('select').siblings('label').removeClass('select').parents('div.hover').next('div:first').html($(this).next('div:first').html())
},function(){});
$('div.click label').click(function(){
$(this).addClass('select').siblings('label').removeClass('select').parents('div.click').next('div:first').html($(this).next('div:first').html())
},function(){});
})
$(function($){
$(function(){
$('.default:first').hide();
$('.active:first').show();
});
$('.slideList').hover(function(){
$(this).children('.default').hide();
$(this).children('.active').show();
$(this).siblings().children('.default').show();
$(this).siblings().children('.active').hide();
},function(){
$(this).children('.default').hide();
$(this).children('.active').show();
});
})
//-->
</script>
</head>
<body>
<div class="con">
<div class="hover">
<label>设计师排名</label>
<div class="div_h_auto">
<div class="slideList">
<div class="active">
<div class="photo"><a href="#" ><img src="#" /></a></div>
<p><span>设计师:</span><a href="#" >壮壮</a></p>
<p>为您打造一个温馨舒适的家是我最大的心愿!</p>
<div class="clear"></div>
</div>
<div class="default">
<p class="rank">1</p>
<p><a href="#" >壮壮</a></p>
<p class="city"><span>专长:</span>住宅公寓 别墅 办公楼 </p>
<div class="clear"></div>
</div>
</div>
<div class="slideList">
<div class="active">
<div class="photo"><a href="#" ><img src="#" /></a></div>
<p><span>设计师:</span><a href="#" >壮壮</a></p>
<p>为您打造一个温馨舒适的家是我最大的心愿!</p>
<div class="clear"></div>
</div>
<div class="default">
<p class="rank">2</p>
<p><a href="#" >壮壮</a></p>
<p class="city"><span>专长:</span>住宅公寓 别墅 办公楼 </p>
<div class="clear"></div>
</div>
</div>
</div>
<label>装饰公司排名</label>
<div class="div_h_auto">
<ul>
<li><a href="2009/0816/7919.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7918.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7917.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7919.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7918.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7917.html" target="_blank">继续测试中做呢!</a></li>
</ul>
</div>
<label>工作室排名</label>
<div class="div_h_auto">
<ul>
<li><a href="2009/0816/7919.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7918.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7917.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7919.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7918.html" target="_blank">继续测试中做呢!</a></li>
<li><a href="2009/0816/7917.html" target="_blank">继续测试中做呢!</a></li>
</ul>
</div>
</div>
<div class="show">Loading...</div>
</div>
</body>
</html>
作者: byyy521 发布时间: 2009-10-12
相关阅读 更多
热门阅读
-
office 2019专业增强版最新2021版激活秘钥/序列号/激活码推荐 附激活工具
阅读:74
-
如何安装mysql8.0
阅读:31
-
Word快速设置标题样式步骤详解
阅读:28
-
20+道必知必会的Vue面试题(附答案解析)
阅读:37
-
HTML如何制作表单
阅读:22
-
百词斩可以改天数吗?当然可以,4个步骤轻松修改天数!
阅读:31
-
ET文件格式和XLS格式文件之间如何转化?
阅读:24
-
react和vue的区别及优缺点是什么
阅读:121
-
支付宝人脸识别如何关闭?
阅读:21
-
腾讯微云怎么修改照片或视频备份路径?
阅读:28