asp.net里面像QQ相册那样列表然后预览的jquery特效

流年岁月 2010-11-02 09:32:08
asp.net里面像QQ相册那样列表然后预览的jquery特效
谁有这样的完整例子，高分求！谢谢！
...全文
175 6 打赏 收藏 转发到动态 举报
写回复
用AI写文章
6 条回复
切换为时间正序
请发表友善的回复…
发表回复
csdsuper 2011-12-03
  • 打赏
  • 举报
 回复
我也在看有没有好的
流年岁月 2010-11-02
  • 打赏
  • 举报
 回复
[Quote=引用 1 楼 qingfeng_wu 的回复:]
预览：http://www.intelliance.fr/jquery/imagebox/
下载：http://www.qianduan.net/top-10-jquery-lightbox-scripts.html
[/Quote]
谢谢这位哥们 你提供的东西很好用 加QQ以后多多请教你 我的QQ 790212655 谢谢
段传涛 2010-11-02
  • 打赏
  • 举报
 回复
-----------------------------------把代码放到txt里然后修改后缀。
把如下代码加入<body>区域中
<script language="JavaScript">
<!--
//该函数在调用过程中只需要在将要点击的单元格内的onclick事件中调用showme函数即可
//function showme(obj1, obj2)该函数主要为使点击的对象高亮度显示，并调用moveme函数，参数obj1为母体即<div>标签的id，obj2为点击对象本身
//function moveme(obj)该函数判断单元的移动，并调用相应的函数处理，obj参数为母体
//function moveup(obj,objtop)该函数使一个单元向上移动，参数obj为母体，objtop为母体的本身最高高度
//function movedown(obj,objbuttom)该函数使一个单元向下移动，参数obj为母体，objbuttom为母体的本身最低高度

var headHeight = 22;//每个标题的高度
var bodyHeight = 160;//母体高度
var objcount = 6;//项目的个数，要改变了项目的个数别忘了该这个东西
var step = 6;//移动速度(请确认可以被'bodyHeight-headHeight'整除,当前的设定可选速度为1,2,3,6,23,138)
var moving = false;//是否有移动的项目

function showme(obj1, obj2)
{
//以下循环为改变标题的背景颜色
if (moving)
return;
moving = true;
for(i=0;i<document.all.tags("td").length;i++)
if (document.all.tags("td")[i].className.indexOf('headtd') == 0)
document.all.tags("td")[i].className = 'headtd1';
obj2.className = 'headtd2';
moveme(obj1);
}

function moveme(obj)
{
idnumber = parseInt(obj.id.substr(4));
objtop = headHeight * (idnumber - 1);
objbuttom = bodyHeight + headHeight * (idnumber - 2);
currenttop = parseInt(obj.style.top);
if (currenttop >= objbuttom)
{
//检验出每一个应该向上移动的层
countid = 1;
for(i=0;i<document.all.tags("div").length;i++)
if (document.all.tags("div")[i].id == 'item'+countid+'body')
{
obj = document.all.tags("div")[i];
objtop = headHeight * (countid - 1);
if (countid == idnumber)
{
moveup(obj,objtop,false);
break;
}
else
moveup(obj,objtop,true);
countid++;
}
}
else if ((currenttop <= objtop) && (idnumber < objcount))
{
//检验出每一个应该向下移动的层
idnumber++;
countid = objcount;
for(i=document.all.tags("div").length-1;i>=0;i--)
if (document.all.tags("div")[i].id == 'item'+countid+'body')
{
obj = document.all.tags("div")[i];
objbuttom = bodyHeight + headHeight * (countid - 2);
if (countid == idnumber)
{
movedown(obj,objbuttom,false);
break;
}
else
movedown(obj,objbuttom,true);
countid--;
}
}
}

function moveup(obj,objtop,ismove)
{
currenttop = parseInt(obj.style.top);
if (currenttop > objtop)
{
obj.style.top = currenttop - step;
setTimeout('moveup('+obj.id+','+objtop+','+ismove+')',1)
return;
}
moving = ismove;
}

function movedown(obj,objbuttom,ismove)
{
currenttop = parseInt(obj.style.top);
if (currenttop < objbuttom)
{
obj.style.top = currenttop + step;
setTimeout('movedown('+obj.id+','+objbuttom+','+ismove+')',1)
return;
}
moving = ismove;
}
// -->
</script>
<style type="text/css">
<!--
.headtd1 { background: #00A4E1; border: 2px outset; border-color: #00BBFF #0077FF #0077FF #00BBFF; cursor: hand; font-size: 9pt}
.headtd2 { background: #20C1FF; border: 2px outset; border-color: #60D3FF #0077FF #0077FF #60D3FF; cursor: hand; font-size: 9pt}
.bodytd { background: #99CCFF; border: 2px outset; border-color: #B0D8FF #0077FF #0077FF #B0D8FF; font-size: 9pt}
-->
</style>
<!--改改这个div（mainboard）的height，加一个项目当然要把它的值加22了，减一个项目当然就是减22了//-->
<div id="mainboard" style="position:absolute; left:2px; top:2px; width:120px; height:270px; z-index:3; overflow: hidden; background: #0099FF;" onclick="">
<div id="item1body" style="position:absolute; left:0; top:0; width:120px; height:160px; z-index:1; overflow: hidden">
<table width="100%" border="0" height="100%" cellpadding="2" cellspacing="0">
<tr>
<td id="item1head" height="20" class="headtd2" onclick="showme(item1body,this)">
<div align="center">工作室</div>
</td>
</tr>
<tr>
<td class="bodytd">

<div align="center"><a href="http://www.sohu.com">搜狐</a></div>
<div align="center"><a href="http://www.sina.com">新浪</a></div>
<div align="center"><a href="http://www.ifeng.com">凤凰</a></div>
</td>
</tr>
</table>
</div>
<div id="item2body" style="position:absolute; left:0px; top:160; width:120; height:160; z-index:2; overflow: hidden">
<table width="100%" border="0" height="100%" cellpadding="2" cellspacing="0">
<tr>
<td id="item2head" height="20" class="headtd1" onclick="showme(item2body,this)">
<div align="center">邮箱</div>
</td>
</tr>
<tr>
<td class="bodytd">
<div align="center"><a href="mailto:webmaster@k688.com">发信给我哟</a></div>
</td>
</tr>
</table>
<p class="headtd1"> </p>
</div>
<div id="item3body" style="position:absolute; left:0; top:182; width:120px; height:160; z-index:3">
<table width="100%" border="0" height="100%" cellpadding="2" cellspacing="0">
<tr>
<td id="item3head" height="20" class="headtd1" onclick="showme(item3body,this)">
<div align="center">Q Q</div>
</td>
</tr>
<tr>
<td class="bodytd">
<div align="center">37146743</div>
</td>
</tr>
</table>
</div>
<div id="item4body" style="position:absolute; left:0; top:204; width:120px; height:160; z-index:4; overflow: hidden">
<table width="100%" border="0" height="100%" cellpadding="2" cellspacing="0">
<tr>
<td id="item4head" height="20" class="headtd1" onclick="showme(item4body,this)">
<div align="center">朋友</div>
</td>
</tr>
<tr>
<td class="bodytd">
<div align="center">
<p>小一、旁腾

</p>
</div>
</td>
</tr>
</table>
</div>
<div id="item5body" style="position:absolute; left:0; top:226; width:120px; height:160; z-index:4; overflow: hidden">
<table width="100%" border="0" height="100%" cellpadding="2" cellspacing="0">
<tr>
<td id="item5head" height="20" class="headtd1" onclick="showme(item5body,this)">
<div align="center">陌生人</div>
</td>
</tr>
<tr>
<td class="bodytd">
<div align="center">
<p>小虎

AAP
小伙伴

小一</p>
</div>
</td>
</tr>
</table>
</div>
<!--如果要添加一个子项目请拷贝一份下面的代码并放于后面。干什么，不要拷贝我了，是下面的//-->
<div id="item6body" style="position:absolute; left:0; top:248; width:120px; height:160; z-index:4; overflow: hidden">
<table width="100%" border="0" height="100%" cellpadding="2" cellspacing="0">
<tr>
<td id="item6head" height="20" class="headtd1" onclick="showme(item6body,this)">
<div align="center">版本号</div>
</td>
</tr>
<tr>
<td class="bodytd">
<div align="center">
<p>版本号：1.1



封锁了移动过

程中的点击事件

这样不会出现抖

动现象了。
</div>
</td>
</tr>
</table>
</div>
<!--哎哎，别往下拷贝了，到我得上面为止了，拷贝到代码放到我后面吧
哦，对了别忘了改几个id呀，div的id，td的id，还有onclick事件中的对象id
id的规则是div中item＋数字＋body。td中item＋数字＋head
还有div的style中的top值呀，是多少，上面这个div的top加上22就是了
别忘了按照body下的提示改改mainboard的height呀。还有给教本中的objcount数量改为你现在项目的个数
别傻了，快点行动吧，要不赶不上饭点了//-->
</div>
</body>
</html>
porschev 2010-11-02
  • 打赏
  • 举报
 回复
http://www.open-open.com/ajax/Image.htm
php 模糊图片背景,JavaScript_Javascript实现图片加载从模糊到清晰显示的方法，1.背景介绍 在网络相册应用中 - phpStudy...
本文介绍了在网络相册应用中优化图片加载体验的方法。通过同时加载缩略图和原图，实现图片从模糊到清晰的渐变显示，提升了用户在等待大图加载过程中的视觉感受。首先加载缩略图，然后原图逐步覆盖缩略图，最终显示清晰的原图。这种方法结合了即时预览和快速加载的优点，改善了用户查看照片的体验。
鼎捷易飞9.0.8和9.0.7授权注册文件
源码直接下载地址： https://pan.quark.cn/s/50dc62428457 最新版本的鼎捷易飞9.0.8与易飞9.0.7的授权注册文档，其中基本模块覆盖了10个用户授权，特殊模块则每模块分配3个用户授权，同时提供易飞全模块的授权方案，该授权适用于从易飞9.0至最新的9.0.8版本的所有需求。
基于遗传算法的新的异构分布式系统任务调度算法研究（Matlab代码实现）
内容概要：本文研究了一种基于遗传算法的新型异构分布式系统任务调度算法，旨在解决异构计算环境中任务分配与调度的复杂优化问题。通过Matlab代码实现该算法，充分利用遗传算法强大的全局搜索能力和鲁棒性，对任务执行时间、资源利用率、系统负载均衡等关键性能指标进行综合优化，有效提升分布式系统的整体运行效率与稳定性。研究详细阐述了算法的整体架构设计、染色体编码策略、适应度函数构造、选择机制以及交叉与变异等遗传操作的实现细节，并通过大量仿真实验验证了所提出算法相较于传统调度方法在收敛速度、解的质量和调度性能方面的显著优越性。; 适合人群：具备一定编程基础和优化算法理论知识，从事分布式计算、高性能计算、云计算资源调度或智能优化算法研究的研究生、科研人员及工程技术人员。; 使用场景及目标：①应用于高性能计算、云计算、边缘计算等异构计算平台中的任务调度优化，提升资源利用效率；②为研究人员提供遗传算法在复杂组合优化问题中应用的完整实现案例，深化对智能优化算法设计原理与仿真实践的理解； 阅读建议：建议读者结合提供的Matlab代码深入研读，重点理解适应度函数的设计逻辑与遗传算子的参数调优策略，并可通过更换不同的任务集和系统模型来测试算法的泛化能力与鲁棒性。
中国各省农村人均受教育年限（2006-2024年）
参考李林凤等（2025）一文关于农村劳动力人均受教育年限指标的构建与计算方法，整理了中国31个省份总体、分性别的农村人均受教育年限数据，具体计算方法如下： 农村劳动力人均受教育年限 = （农村未上过学人数 × 1＋小学学历人数 × 6＋初中学历人数 × 9＋高中和中专学历人数 ×12＋大专及以上学历人数 × 16）／农村6岁及以上总人口 相关数据：各地区、分性别人均受教育年限数据 一、数据介绍 数据名称：中国各省农村人均受教育年限 数据范围：全国31个省份 时间范围：2006-2024年 样本数量：590条 数据来源：《中国人口和就业统计年鉴》、《中国劳动统计年鉴》 二、数据指标 年份 省份 省份代码 农村人均受教育年限 男性-农村人均受教育年限 女性-农村人均受教育年限 6岁及以上人口 6岁及以上人口_男 6岁及以上人口_女 未上过学人口 未上过学人口_男 未上过学人口_女 小学人口 小学人口_男 小学人口_女 初中人口 初中人口_男 初中人口_女 高中人口 高中人口_男 高中人口_女 大专及以上人口 大专及以上人口_男 大专及以上人口_女 三、参考文献 [1]李林凤,刘杨,杨亦民.种业创新驱动农村产业融合的作用机制与空间分异效应[J].广东财经大学学报,2025,40(6):97-109. [2]徐小阳,李洁,金丽馥.普惠金融对农村教育贫困的纾解效应[J].中国农村经济,2020,(9):41-64.
复现基于改进秃鹰算法的微电网群经济优化调度研究（Matlab代码实现）
内容概要：本文围绕基于改进秃鹰算法的微电网群经济优化调度展开研究，提出了一种结合智能优化算法的调度模型，旨在实现微电网群运行过程中的成本最小化与能源利用效率最大化。研究详细阐述了改进秃鹰算法的原理与优化机制，将其应用于含分布式电源、储能系统及多元负荷的微电网群多目标经济调度问题中，充分考虑系统运行约束与能源交互特性，构建了完整的数学模型，并通过Matlab代码实现了算法仿真与结果验证。该资源不仅提供了核心算法代码，还整合了电力系统建模、智能优化、仿真分析等关键技术，形成一套完整的科研复现体系，有助于深入理解先进优化算法在现代能源系统中的实际应用。; 适合人群：具备电力系统基础、优化算法理论及Matlab编程能力的研究生、科研人员和工程技术人员，特别适用于从事微电网、综合能源系统、智能调度等领域研究的专业人士。; 使用场景及目标：①复现并验证改进秃鹰算法在微电网群经济调度中的有效性；②掌握智能优化算法在复杂电力系统调度问题中的建模与求解方法；③依托所提供的Matlab代码开展学术论文复现、科研项目开发或工程方案设计；④拓展应用于储能优化、电动汽车调度、多能协同等关联领域的创新研究。; 阅读建议：建议读者结合文本说明与Matlab代码同步实践，重点关注算法实现细节、模型构建逻辑与参数设置方法，通过仿真实验加深对优化过程的理解，并尝试将该方法迁移至其他类似优化问题中进行对比分析与创新改进。
.NET社区

62,271

社区成员

668,978

社区内容

发帖
与我相关
我的任务
社区描述
.NET技术交流专区
javascript云原生 企业社区
社区管理员
  • ASP.NET
  • .Net开发者社区
  • R小R
加入社区
  • 近7日
  • 近30日
  • 至今

加载中

查看更多榜单
社区公告

.NET 社区是一个围绕开源 .NET 的开放、热情、创新、包容的技术社区。社区致力于为广大 .NET 爱好者提供一个良好的知识共享、协同互助的 .NET 技术交流环境。我们尊重不同意见，支持健康理性的辩论和互动，反对歧视和攻击。

希望和大家一起共同营造一个活跃、友好的社区氛围。

试试用AI创作助手写篇文章吧

+ 用AI写文章