急求如图的实现方式

hongjie · 发表于 2011-2-10 14:20:01

我自己整了一上午还是只能做到单向的滚动，查找了半天还是没弄出来怎么能双向滚动如设计图。请高手赐教！

liongle · 发表于 2011-2-10 14:27:53

很想知道。帮你跟上。希望高手来解惑

bieyinan · 发表于 2011-2-10 14:29:26

JQUETY jCarousel 插件可以实现

businessDiv · 发表于 2011-2-10 15:10:31

你的可以改成单向自动滚动
将内容赋值给一个空的容器
就可以做到双向滚动了

tomato5200 · 发表于 2011-2-10 16:13:05

双向滚动,可点击左右按钮

tomato5200 · 发表于 2011-2-10 16:26:58

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>名医风采</title>
<style type="text/css">
a:link,a:visited,a:hover{ text-decoration:none;}
p{ padding:0; margin:0;}
.todffe{font-size:12px; line-height:21px;word-break:break-all; width:150px; padding-left:5px;}
.co_border05{ line-height:21px; font-size:12px; color:#495A4A; width:290px; height:170px; overflow:hidden;}
.co_border05 img{ float:left; display:inline; border:#FF6699 1px solid; }
.co_border05 b{ font-size:14px; color:#DC2557;}
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
background:none;
}
</style>
</head>
<body style="background:transparent"> <TABLE border=0 cellSpacing=0 cellPadding=0 width=930>
<TBODY>
<TR>
<TD width="25" align="center"><IMG src="http://www.shcafk.cn/images/jjpo.gif" name="left1" width=20 height=34 id=left1 style="CURSOR: pointer"></TD>
<TD vAlign=bottom width=880><div style="WIDTH:880px; HEIGHT: 170px; MARGIN-LEFT: auto; OVERFLOW: hidden; MARGIN-RIGHT: auto" id=marqueedivcontrol>
<table border=0 cellspacing=0 cellpadding=0>
<tbody>
<tr>
<td valign="top"><div class="co_border05">
<table width="280" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
<tr>
<td width="125" align="center" valign="top"><a href="/myfc/750631515.html" target="_blank"><img src="/userpic/23/2010_01_16/4631263633014.jpg" width="120" height="166"></a></td>
<td width="155" valign="top" style="word-break : break-all; "><p class="todffe"><a href="/myfc/750631515.html" target="_blank"><b>蒋美英</b></a><br>
国内资深微创妇科专家,从事妇产科临床和科研工作近五十余年，具有丰富的临床医疗经验，在妇科领域中享有很高威望。率先运用宫腹腔镜微创技术诊断治疗…【<a href="/myfc/750631515.html" target="_blank"><span style="color:#CC1645;">详细</span></a>】</p></td>
</tr>
</table>
</div></td><td valign="top"><div class="co_border05">
<table width="280" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
<tr>
<td width="125" align="center" valign="top"><a href="/myfc/719628700.html" target="_blank"><img src="/userpic/23/2010_01_16/2011263632886.jpg" width="120" height="166"></a></td>
<td width="155" valign="top" style="word-break : break-all; "><p class="todffe"><a href="/myfc/719628700.html" target="_blank"><b>陶根仙</b></a><br>
曾多次应邀参加各类学术交流会，擅长宫腔镜、腹腔镜等微创技术治疗妇科各种肿瘤、功血、宫颈糜烂、乳腺疾病、子宫肌瘤、不孕不育等妇科疾病，在运用激…【<a href="/myfc/719628700.html" target="_blank"><span style="color:#CC1645;">详细</span></a>】</p></td>
</tr>
</table>
</div></td><td valign="top"><div class="co_border05">
<table width="280" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
<tr>
<td width="125" align="center" valign="top"><a href="/myfc/20090806-544.html" target="_blank"><img src="/userpic/23/2010_01_06/9451262757767.jpg" width="120" height="166"></a></td>
<td width="155" valign="top" style="word-break : break-all; "><p class="todffe"><a href="/myfc/20090806-544.html" target="_blank"><b>魏春芳</b></a><br>
魏春芳,国内著名中医妇科专家、中西医结合学会会员、中医疑难病研究会专家委员，江苏省中医药学会妇科分会常务委员、市医疗事故鉴定委员会专家库成员…【<a href="/myfc/20090806-544.html" target="_blank"><span style="color:#CC1645;">详细</span></a>】</p></td>
</tr>
</table>
</div></td><td valign="top"><div class="co_border05">
<table width="280" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
<tr>
<td width="125" align="center" valign="top"><a href="/myfc/20090314-419.html" target="_blank"><img src="/uploads/100/090314/_10493Rc.jpg" width="120" height="166"></a></td>
<td width="155" valign="top" style="word-break : break-all; "><p class="todffe"><a href="/myfc/20090314-419.html" target="_blank"><b>杨学玉</b></a><br>
中国第一妇科网特约健康顾问，妇科疾病康复学会主任委员，上海微创妇科技术交流协会专家，从事妇产科临床、教学科研工作三十余年，临床经验丰富、技术…【<a href="/myfc/20090314-419.html" target="_blank"><span style="color:#CC1645;">详细</span></a>】</p></td>
</tr>
</table>
</div></td><td valign="top"><div class="co_border05">
<table width="280" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
<tr>
<td width="125" align="center" valign="top"><a href="/myfc/20090117-395.html" target="_blank"><img src="/userpic/23/2010_01_06/9901262768254.jpg" width="120" height="166"></a></td>
<td width="155" valign="top" style="word-break : break-all; "><p class="todffe"><a href="/myfc/20090117-395.html" target="_blank"><b>徐静龙</b></a><br>
上海医科大学医学临床本科毕业，现任上海复旦大学附属妇产科医院(红房子医院)副主任医师、副教授。擅长阴道炎、宫颈炎、盆腔炎、子宫肌瘤、卵巢囊肿…【<a href="/myfc/20090117-395.html" target="_blank"><span style="color:#CC1645;">详细</span></a>】</p></td>
</tr>
</table>
</div></td><td valign="top"><div class="co_border05">
<table width="280" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
<tr>
<td width="125" align="center" valign="top"><a href="/myfc/20090117-394.html" target="_blank"><img src="/userpic/23/2010_01_06/1251262768143.jpg" width="120" height="166"></a></td>
<td width="155" valign="top" style="word-break : break-all; "><p class="todffe"><a href="/myfc/20090117-394.html" target="_blank"><b>魏美娟</b></a><br>
毕业于上海中医学院(现上海中医药大学)西学中研究班，1 995年晋升为副教授，现任中西医结合上海妇产科专业委员会委员。从事中西医结合妇产科生…【<a href="/myfc/20090117-394.html" target="_blank"><span style="color:#CC1645;">详细</span></a>】</p></td>
</tr>
</table>
</div></td><td valign="top"><div class="co_border05">
<table width="280" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
<tr>
<td width="125" align="center" valign="top"><a href="/myfc/803925527.html" target="_blank"><img src="/userpic/23/2010_11_10/6961289362175.jpg" width="120" height="166"></a></td>
<td width="155" valign="top" style="word-break : break-all; "><p class="todffe"><a href="/myfc/803925527.html" target="_blank"><b>皮肤病主任 姚其柏【共和国名医】</b></a><br>
姚其柏副主任医师;擅长治结缔组织疾病、中西医结合治疗慢性湿疹、皮炎等常见皮肤病、多发病。…【<a href="/myfc/803925527.html" target="_blank"><span style="color:#CC1645;">详细</span></a>】</p></td>
</tr>
</table>
</div></td><td valign="top"><div class="co_border05">
<table width="280" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
<tr>
<td width="125" align="center" valign="top"><a href="/myfc/780630961.html" target="_blank"><img src="/userpic/23/2010_01_16/3361263632754.jpg" width="120" height="166"></a></td>
<td width="155" valign="top" style="word-break : break-all; "><p class="todffe"><a href="/myfc/780630961.html" target="_blank"><b>汪榴英</b></a><br>
原上海市市东医院妇产科副主任、上海市专家医学研究中心妇产科专家组成员从事临床医疗工作40年，对妇产科疾病的处理有独特的治疗经验，擅长对难治性…【<a href="/myfc/780630961.html" target="_blank"><span style="color:#CC1645;">详细</span></a>】</p></td>
</tr>
</table>
</div></td><td valign="top"><div class="co_border05">
<table width="280" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
<tr>
<td width="125" align="center" valign="top"><a href="/myfc/944630627.html" target="_blank"><img src="/userpic/23/2010_01_16/4471263632869.jpg" width="120" height="166"></a></td>
<td width="155" valign="top" style="word-break : break-all; "><p class="todffe"><a href="/myfc/944630627.html" target="_blank"><b>王凤霞</b></a><br>
副主任护师，曾在三甲医院从事护理工作30余年，具有丰富的护理管理、临床护理、心理护理、护理科研及职业培训经验。护理操作技术娴熟，业务能力强、…【<a href="/myfc/944630627.html" target="_blank"><span style="color:#CC1645;">详细</span></a>】</p></td>
</tr>
</table>
</div></td><td valign="top"><div class="co_border05">
<table width="280" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
<tr>
<td width="125" align="center" valign="top"><a href="/myfc/20090806-543.html" target="_blank"><img src="/uploads/0001/090806/_121JN27.jpg" width="120" height="166"></a></td>
<td width="155" valign="top" style="word-break : break-all; "><p class="todffe"><a href="/myfc/20090806-543.html" target="_blank"><b>李凤娥</b></a><br>
李凤娥，国内资深微创妇科医师，长期从事妇科临床工作,具有深厚的妇产科理论知识和丰富的临床医疗经验.具有有扎实的专业理论及解决妇产科疑难杂症能…【<a href="/myfc/20090806-543.html" target="_blank"><span style="color:#CC1645;">详细</span></a>】</p></td>
</tr>
</table>
</div></td><td valign="top"><div class="co_border05">
<table width="280" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
<tr>
<td width="125" align="center" valign="top"><a href="/myfc/20090314-418.html" target="_blank"><img src="/uploads/100/090314/_104301306.jpg" width="120" height="166"></a></td>
<td width="155" valign="top" style="word-break : break-all; "><p class="todffe"><a href="/myfc/20090314-418.html" target="_blank"><b>周莉</b></a><br>
国内资深妇科医师，上海妇科名医馆专家组成员，国家妇幼保健协会理事，从事临床工作10多年以来一直致力于妇科疾病的治疗研究，特别是妇科炎症临床治…【<a href="/myfc/20090314-418.html" target="_blank"><span style="color:#CC1645;">详细</span></a>】</p></td>
</tr>
</table>
</div></td><td valign="top"><div class="co_border05">
<table width="280" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
<tr>
<td width="125" align="center" valign="top"><a href="/myfc/20090310-403.html" target="_blank"><img src="/userpic/23/2010_01_06/7201262758824.jpg" width="120" height="166"></a></td>
<td width="155" valign="top" style="word-break : break-all; "><p class="todffe"><a href="/myfc/20090310-403.html" target="_blank"><b>王艳容</b></a><br>
王艳容,资深妇科医师，长安妇科医院学科带头人，中国著名妇科网特约主编，从事妇科临床工作 近二十年，积累了丰富的临床经验，并多次应邀参加国内外…【<a href="/myfc/20090310-403.html" target="_blank"><span style="color:#CC1645;">详细</span></a>】</p></td>
</tr>
</table>
</div></td><td valign="top"><div class="co_border05">
<table width="280" border="0" cellspacing="0" cellpadding="0" style="table-layout:fixed;">
<tr>
<td width="125" align="center" valign="top"><a href="/myfc/20090310-402.html" target="_blank"><img src="/uploads/0001/090806/_115124615.jpg" width="120" height="166"></a></td>
<td width="155" valign="top" style="word-break : break-all; "><p class="todffe"><a href="/myfc/20090310-402.html" target="_blank"><b>邵莉萍</b></a><br>
上海长安妇科医院学科带头人、妇科绿色疗法倡导者， 从事妇科临床工作二十余年，在长 期的一线工作中积累了丰富的临床经验，对常见的女性生殖系统炎…【<a href="/myfc/20090310-402.html" target="_blank"><span style="color:#CC1645;">详细</span></a>】</p></td>
</tr>
</table>
</div></td></tr>
</tbody>
</table>
</div></TD>
<TD width="25" align="center" ><IMG src="http://www.shcafk.cn/images/jjpo1.gif" name="right1" width=20 height=34 id=right1 style="CURSOR: pointer"></TD>
</TR>
</TBODY>
</TABLE>
<script src="http://www.shcafk.cn/js/msclass.js" type="text/javascript"></script>
<SCRIPT>
var marquee2=new Marquee("marqueedivcontrol");
marquee2.Direction="left";
marquee2.Step=1;
marquee2.Width=880;
marquee2.Height=170;
marquee2.Timer=20;
marquee2.ScrollStep=1;//此句禁止鼠标控制
left1.onclick=function(){marquee2.Direction=2};
right1.onclick=function(){marquee2.Direction=3};
marquee2.Start();
</SCRIPT>
</body>
</html>

提示：您可以先修改部分代码再运行

hongjie · 发表于 2011-2-10 17:03:11

多谢！回头再仔细研究一下 ~

woiweb · 发表于 2011-2-10 17:50:10

自己找找吧，都在这呢
http://www.woiweb.net/category/jquery

hongjie · 发表于 2011-2-11 09:36:59

好丰富啊多谢！

帐号		自动登录	找回密码
密码			注册

急求如图的实现方式

回复 6# tomato5200 的帖子

这里面有很多都可以

回复 8# woiweb 的帖子