求一个jQuery功能！
功能是点右边的小图，左边的详细切换到对应的内容，同时小图和详细内容都要有滚动条。 --------------------编程问答-------------------- 其实div就可以满足你了包括滚动条，你点击时只是设置div的html内容就行了，至于这种样式，可能需要你自己加工了，或者用第三方的 --------------------编程问答--------------------
我对JS也不是非常熟悉，现在的问题是如果左边没有滚动条，我已经做好了，但左边一加滚动条，右边的滚动条也没作用了，好像是有冲突，没找到原因。所以想要个DOME看看。 --------------------编程问答-------------------- 小图用服务器生成Thumbnail吧 --------------------编程问答--------------------
图片和内容总条数不多，没必要用数据库，写成静态的就可以。 --------------------编程问答-------------------- 没人有这种DOME吗？ --------------------编程问答-------------------- demo中的素材请自己补充完整，并且放在与.html文件同级目录下
1(1).jpg
1(2).jpg
1(3).jpg
jquery-1.4.1.js
<!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>
<title></title>
<script src="jquery-1.4.1.js" type="text/javascript"></script>
<script type="text/javascript">
var full_text_1 = "寄给那年七号的雨季<br />" +
"有一些等待不能太漫长<br />" +
"已经枯萎在心底<br />" +
"那天的日记天飘着雨<br />" +
"我躲进眼泪你在那里<br />" +
"夕阳和海面依然清晰<br />" +
"还是在这里我丢了你<br />" +
"我把对你的思念写在海角上<br />" +
"寄给那年七号的雨季<br />" +
"有些爱不怕时间太漫长<br />" +
"已经生长在心里<br />" +
"我把对你的思念写在海角上<br />" +
"寄给那年七号的雨季<br />" +
"有一些等待不能太漫长<br />" +
"已经枯萎在心底<br />" +
"我把对你的思念写在海角上<br />" +
"寄给那年七号的雨季<br />" +
"有一些等待不能太漫长<br />" +
"已经枯萎在心底<br />" +
"有一些等待不能太漫长<br />" +
"已经枯萎在心底";
var full_text_2 = "寄给那年七号的雨季<br />" +
"有一些等待不能太漫长<br />" +
"已经枯萎在心底<br />" +
"那天的日记天飘着雨<br />" +
"我躲进眼泪你在那里<br />" +
"夕阳和海面依然清晰<br />" +
"还是在这里我丢了你<br />" +
"我把对你的思念写在海角上<br />" +
"寄给那年七号的雨季<br />" +
"有些爱不怕时间太漫长<br />" +
"已经生长在心里<br />" +
"我把对你的思念写在海角上<br />" +
"寄给那年七号的雨季<br />" +
"有一些等待不能太漫长<br />" +
"已经枯萎在心底<br />" +
"我把对你的思念写在海角上<br />" +
"寄给那年七号的雨季<br />" +
"有一些等待不能太漫长<br />" +
"已经枯萎在心底<br />" +
"有一些等待不能太漫长<br />" +
"已经枯萎在心底";
var full_text_3 = "寄给那年七号的雨季<br />" +
"有一些等待不能太漫长<br />" +
"已经枯萎在心底<br />" +
"那天的日记天飘着雨<br />" +
"我躲进眼泪你在那里<br />" +
"夕阳和海面依然清晰<br />" +
"还是在这里我丢了你<br />" +
"我把对你的思念写在海角上<br />" +
"寄给那年七号的雨季<br />" +
"有些爱不怕时间太漫长<br />" +
"已经生长在心里<br />" +
"我把对你的思念写在海角上<br />" +
"寄给那年七号的雨季<br />" +
"有一些等待不能太漫长<br />" +
"已经枯萎在心底<br />" +
"我把对你的思念写在海角上<br />" +
"寄给那年七号的雨季<br />" +
"有一些等待不能太漫长<br />" +
"已经枯萎在心底<br />" +
"有一些等待不能太漫长<br />" +
"已经枯萎在心底";
$(document).ready(function () {
var full_img_1 = "1(1).jpg";
var full_img_2 = "1(2).jpg";
var full_img_3 = "1(3).jpg";
$(".template-title").unbind().bind("click", function () {
$("#img-full").show();
var rid = $(this).attr("rid");
switch (rid) {
case "1":
$("#img-full").attr("src", full_img_1);
var text = $(this).children(".div-text").html();
$("#div-full-content").html("<h1>" + text + "</h1>" + full_text_1);
break;
case "2":
$("#img-full").attr("src", full_img_2);
var text = $(this).children(".div-text").html();
$("#div-full-content").html("<h1>" + text + "</h1>" + full_text_2);
break;
case "3":
$("#img-full").attr("src", full_img_3);
var text = $(this).children(".div-text").html();
$("#div-full-content").html("<h1>" + text + "</h1>" + full_text_3);
break;
default:
return;
}
});
});
</script>
<style type="text/css">
#mainContent
{width:80%; margin-left:10%;}
#left-full-content
{ width:70%; float:left; overflow:scroll; height:600px;}
#right-Thumbnail-content
{ width:30%; float:left; overflow:scroll;}
.template-title
{border:1px solid green; cursor:pointer;}
.div-img,#div-full-img
{text-align:center; margin-right: 0px; border:1px solid #eee; margin:5px;}
.div-text
{border:1px solid #eef; margin:5px;}
#div-full-content
{border:1px solid #eef; margin:5px;width:100%; text-align:center;}
</style>
</head>
<body>
<div id="mainContent" >
<div id="left-full-content">
<div id="div-full-img">
<img id="img-full" src="#" width="300px" style="display:none;" height="500px" />
</div>
<div id="div-full-content">
</div>
</div>
<div id="right-Thumbnail-content">
<div class="template-title" rid="1">
<div class="div-img">
<img src="1(1).jpg" width="100px" height="100px" />
</div>
<div class="div-text" style="text-align:center;">
寄给那年七号的雨季,有一些等待不能太漫长
</div>
</div>
<br />
<div class="template-title" rid="2">
<div class="div-img">
<img src="1(2).jpg" width="100px" height="100px" />
</div>
<div class="div-text" style="text-align:center;">
你是我天边 最美的云彩,让我用心把你留下来（留下来
</div>
</div>
<br />
<div class="template-title" rid="3">
<div class="div-img">
<img src="1(3).jpg" width="100px" height="100px" />
</div>
<div class="div-text" style="text-align:center;">
过完整个夏天 忧伤并没有好一些
</div>
</div>
<br />
</div>
</div>
</body>
</html>
请教你这个如果要在详细区域默认第一条信息要怎么弄？ --------------------编程问答-------------------- 直接加载第一条不就好了嘛？ --------------------编程问答--------------------
这不是数据库
补充：.NET技术 , ASP.NET
