`

Jquery 仿新浪首页信息滚动效果1

 
阅读更多

 

<!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>tweets-slide</title>

<meta http-equiv="Content-type" content="text/html; charset=utf-8" />

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>

<style  type="text/css" _mce_bogus="1">

<!--

body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td { margin:0; padding:0; }

body, button, input, select, textarea { font:12px/1.5 tahoma, arial, \5b8b\4f53; color:#666; }

ul, ol { list-style:none; }

a { text-decoration:none; }

a:hover { text-decoration:underline; }

body{background-color:#ECF5FF;}

#wp{width:500px; height:400px; overflow:hidden; margin:20px auto; border:1px solid #333; background-color:#fff; position:relative;}

.wp_con{padding:10px; border-bottom:1px dashed #333; background-color:#fff;}

.wp_shade{background:url(wp_shade.png) 0 0 no-repeat; width:500px; height:45px; position:absolute; left:0; bottom:-1px; overflow:hidden;}

-->

</style>

<script type="text/javascript">

(function(a) {

a.fn.slider = function(d) {

var g = {

sliderTime: 3000,

sliderEffect: "shovedOff", // sliderEffect每次变化的函数

coincide: true, // 控制先变化height后变化opacity的效果，false时类似于微博效果

mousePause: true, // 鼠标控制暂停与播放的事件，true时增加鼠标事件

itemFlag: "" // 增加HTML子类的附加属性，直接定义即可

};

var i = 0;

var b = a.extend(g, d);

var f = b.sliderTime;

var h = a(this);

if (b.mousePause) {

h.bind("mouseleave",

function() {

clearTimeout(i);

i = setInterval(function() {

c[b.sliderEffect]()

},

f)

});

h.bind("mouseenter",

function() {

clearTimeout(i)

})

}

var e = function() {

$s_first_child = h.find("." + b.itemFlag + ":first-child");

$s_last_child = h.find("." + b.itemFlag + ":last-child");

firstH = $s_first_child.height();

lastH = $s_last_child.height();

};

var c = {

shovedOff: function() {

e();

$s_last_child.css({

opacity: 0,

height: 0

}).prependTo(h);

if (!b.coincide) {

$s_last_child.animate({

height: lastH

},

800,

function() {

a(this).animate({

opacity: 1

},

600)

})

} else {

$s_last_child.css({

opacity: 1

}).animate({

height: lastH

},

1200)

}

}

};

i = setInterval(function() {

c[b.sliderEffect]()

},

f)

}

})(jQuery); 

</script>

</head>

<body>

<div id="wp">

<div id="wp_inner">

        <div class="wp_con">

            NO.1 test!NO.1 test!NO.1 test!NO.1 test!NO.1 test!NO.1 test!NO.1 test!NO.1 test!NO.1 test!NO.1 test!

        </div>

        <div class="wp_con">

            NO.2 test!NO.2 test!NO.2 test!NO.2 test!NO.2 test!NO.2 test!NO.2 test!NO.2 test!NO.2 test!NO.2 test!NO.2 test!NO.2 test!NO.2 test!NO.2 test!NO.2 test!NO.2 test!NO.2 test!

        </div>

        <div class="wp_con">

            NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!NO.3 test!

        </div>

        <div class="wp_con">

            NO.4 test!NO.4 test!NO.4 test!NO.4 test!NO.4 test!NO.4 test!NO.4 test!NO.4 test!NO.4 test!NO.4 test!NO.4 test!NO.4 test!

        </div>

        <div class="wp_con">

            NO.5 test!NO.5 test!NO.5 test!NO.5 test!NO.5 test!NO.5 test!NO.5 test!NO.5 test!NO.5 test!NO.5 test!NO.5 test!NO.5 test!NO.5 test!NO.5 test!NO.5 test!NO.5 test!

        </div>

        <div class="wp_con">

            NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!NO.6 test!

        </div>

        <div class="wp_con">

            NO.7 test!NO.7 test!NO.7 test!NO.7 test!NO.7 test!NO.7 test!NO.7 test!

        </div>

        <div class="wp_con">

            NO.8 test!NO.8 test!NO.8 test!NO.8 test!NO.8 test!NO.8 test!NO.8 test!NO.8 test!NO.8 test!NO.8 test!NO.8 test!NO.8 test!NO.8 test!NO.8 test!

        </div>

        <div class="wp_con">

            NO.9 test!NO.9 test!NO.9 test!NO.9 test!NO.9 test!NO.9 test!NO.9 test!NO.9 test!NO.9 test!NO.9 test!NO.9 test!NO.9 test!

        </div>

        <div class="wp_con">

            NO.10 test!NO.10 test!NO.10 test!NO.10 test!NO.10 test!NO.10 test!NO.10 test!NO.10 test!NO.10 test!NO.10 test!NO.10 test!NO.10 test!NO.10 test!NO.10 test!NO.10 test!

        </div>

    </div>

    <div class="wp_shade" style="_filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='wp_shade.png', sizingMethod='scale');_background-image:none;"></div>

    <!-- src不支持相对路径，使用绝对路径 -->

</div>

<script type="text/javascript">

$('#wp_inner').slider({

sliderTime:4000,

coincide:false

});

</script>

 

</body>

</html>


分享到：
| PHP格式化时间
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    FastReport 模版打印如何实现

    FastReport 模版打印如何实现

    使用运算放大器模拟反相放大器的闭环电压增益simulink.rar

    1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。

    基于java的抗疫医疗用品销售平台设计与实现.docx

    基于java的抗疫医疗用品销售平台设计与实现.docx

    vue+SpringBoot749乡村日常政务管理系统的设计与实现java毕业设计源码含论文.rar

    jdk版本:jdk1.8+ 前端：vue.js+ElementUI 开发工具：IDEA 或者eclipse都支持 编程语言: java 框架支持：springboot 数据库: mysql 版本不限 数据库工具：Navicat/SQLyog都可以 详细技术：java+springboot+vue+MYSQL+MAVEN 前端采用的Vue框架，后端采用java语言，sprinboot框架，mybatis操作数据源，使用软件：idea,eclipse、MySQL。完成了用户登录管理等模块的设计与实现。完成了系统数据库的设计，并基于MySQL数据库管理系统

    java毕业设计源码ssm859基于SSM框架的线上DIY手工艺品综合平台+vue程序数据库含论文.rar

    前端采用的Vue框架，后端采用java语言，ssm框架，mybatis操作数据源，使用软件：idea,eclipse、MySQL。完成了用户登录管理等模块的设计与实现。完成了系统数据库的设计，并基于MySQL数据库管理系统 本系统基于SSM(Spring+SpringMVC+MyBatis)框架,适用于毕业设计， 基于B/S模式, mysql数据库,感兴趣的朋友们可以下载研究一下。 jdk版本:jdk1.8+ 前端：vue.js+ElementUI 开发工具：IDEA 或者eclipse都支持 编程语言: java 框架支持：ssm 数据库: mysql 版本不限 数据库工具：Navicat/SQLyog都可以 详细技术：java+ssm+vue+MYSQL+MAVEN

    java基于ssm+vue企业在线培训系统源码 带毕业论文

    【资源说明】 1、开发环境：ssm框架；内含Mysql数据库；VUE技术 2、项目代码都经过严格调试，代码没有任何bug！下载可以直接使用！ 3、本项目适合作为计算机、数学、电子信息等专业的课程设计、期末大作业和毕设项目，作为参考资料学习借鉴。 4、本资源作为“参考资料”如果需要实现其他功能，需要能看懂代码，并且热爱钻研，自行调试。

    任务管理系统Web（Spring+Mybaties）.zip(毕设&课设&实训&大作业&竞赛&项目)

    项目工程资源经过严格测试可直接运行成功且功能正常的情况才上传，可轻松复刻，拿到资料包后可轻松复现出一样的项目，本人系统开发经验充足（全领域），有任何使用问题欢迎随时与我联系，我会及时为您解惑，提供帮助。 【资源内容】：包含完整源码+工程文件+说明（如有）等。答辩评审平均分达到96分，放心下载使用！可轻松复现，设计报告也可借鉴此项目，该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的。 【提供帮助】：有任何使用问题欢迎随时与我联系，我会及时解答解惑，提供帮助 【附带帮助】：若还需要相关开发工具、学习资料等，我会提供帮助，提供资料，鼓励学习进步 【项目价值】：可用在相关项目设计中，皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面，可借鉴此优质项目实现复刻，设计报告也可借鉴此项目，也可基于此项目来扩展开发出更多功能 下载后请首先打开README文件（如有），项目工程可直接复现复刻，如果基础还行，也可在此程序基础上进行修改，以实现其它功能。供开源学习/技术交流/学习参考，勿用于商业用途。质量优质，放心下载使用。

    这是一个基于mediapipe实现的运动计数项目；大三上期末小组作业；python。.zip

    项目工程资源经过严格测试可直接运行成功且功能正常的情况才上传，可轻松复刻，拿到资料包后可轻松复现出一样的项目，本人系统开发经验充足（全领域），有任何使用问题欢迎随时与我联系，我会及时为您解惑，提供帮助。 【资源内容】：包含完整源码+工程文件+说明（如有）等。答辩评审平均分达到96分，放心下载使用！可轻松复现，设计报告也可借鉴此项目，该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的。 【提供帮助】：有任何使用问题欢迎随时与我联系，我会及时解答解惑，提供帮助 【附带帮助】：若还需要相关开发工具、学习资料等，我会提供帮助，提供资料，鼓励学习进步 【项目价值】：可用在相关项目设计中，皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面，可借鉴此优质项目实现复刻，设计报告也可借鉴此项目，也可基于此项目来扩展开发出更多功能 下载后请首先打开README文件（如有），项目工程可直接复现复刻，如果基础还行，也可在此程序基础上进行修改，以实现其它功能。供开源学习/技术交流/学习参考，勿用于商业用途。质量优质，放心下载使用。

    （全国物联网大赛一等奖，挑战杯铜奖）基于QT的人脸识别，定位导航，脑电心率测算，用GPRS传到服务端的疲劳驾驶检测系统(毕设&课

    项目工程资源经过严格测试可直接运行成功且功能正常的情况才上传，可轻松复刻，拿到资料包后可轻松复现出一样的项目，本人系统开发经验充足（全领域），有任何使用问题欢迎随时与我联系，我会及时为您解惑，提供帮助。 【资源内容】：包含完整源码+工程文件+说明（如有）等。答辩评审平均分达到96分，放心下载使用！可轻松复现，设计报告也可借鉴此项目，该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的。 【提供帮助】：有任何使用问题欢迎随时与我联系，我会及时解答解惑，提供帮助 【附带帮助】：若还需要相关开发工具、学习资料等，我会提供帮助，提供资料，鼓励学习进步 【项目价值】：可用在相关项目设计中，皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面，可借鉴此优质项目实现复刻，设计报告也可借鉴此项目，也可基于此项目来扩展开发出更多功能 下载后请首先打开README文件（如有），项目工程可直接复现复刻，如果基础还行，也可在此程序基础上进行修改，以实现其它功能。供开源学习/技术交流/学习参考，勿用于商业用途。质量优质，放心下载使用。

    南开大学2023年前端开发实训大作业.zip（课设&实训&大作业&项目）

    项目工程资源经过严格测试可直接运行成功且功能正常的情况才上传，可轻松复刻，拿到资料包后可轻松复现出一样的项目，本人系统开发经验充足（全领域），有任何使用问题欢迎随时与我联系，我会及时为您解惑，提供帮助。 【资源内容】：包含完整源码+工程文件+说明（如有）等。答辩评审平均分达到96分，放心下载使用！可轻松复现，设计报告也可借鉴此项目，该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的。 【提供帮助】：有任何使用问题欢迎随时与我联系，我会及时解答解惑，提供帮助 【附带帮助】：若还需要相关开发工具、学习资料等，我会提供帮助，提供资料，鼓励学习进步 【项目价值】：可用在相关项目设计中，皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面，可借鉴此优质项目实现复刻，设计报告也可借鉴此项目，也可基于此项目来扩展开发出更多功能 下载后请首先打开README文件（如有），项目工程可直接复现复刻，如果基础还行，也可在此程序基础上进行修改，以实现其它功能。供开源学习/技术交流/学习参考，勿用于商业用途。质量优质，放心下载使用。

    毕业设计 C-V2X漏洞挖掘 开放资源.zip(毕设&课设&实训&大作业&竞赛&项目)

    项目工程资源经过严格测试可直接运行成功且功能正常的情况才上传，可轻松复刻，拿到资料包后可轻松复现出一样的项目，本人系统开发经验充足（全领域），有任何使用问题欢迎随时与我联系，我会及时为您解惑，提供帮助。 【资源内容】：包含完整源码+工程文件+说明（如有）等。答辩评审平均分达到96分，放心下载使用！可轻松复现，设计报告也可借鉴此项目，该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的。 【提供帮助】：有任何使用问题欢迎随时与我联系，我会及时解答解惑，提供帮助 【附带帮助】：若还需要相关开发工具、学习资料等，我会提供帮助，提供资料，鼓励学习进步 【项目价值】：可用在相关项目设计中，皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面，可借鉴此优质项目实现复刻，设计报告也可借鉴此项目，也可基于此项目来扩展开发出更多功能 下载后请首先打开README文件（如有），项目工程可直接复现复刻，如果基础还行，也可在此程序基础上进行修改，以实现其它功能。供开源学习/技术交流/学习参考，勿用于商业用途。质量优质，放心下载使用。

    基于 Java+SqlServer 实现的学生学籍管理系统毕业设计（源代码+论文+开题报告+外文翻译+答辩PPT）

    【作品名称】：基于 Java+SqlServer 实现的学生学籍管理系统【毕业设计】（源代码+论文+开题报告+外文翻译+答辩PPT） 【适用人群】：适用于希望学习不同技术领域的小白或进阶学习者。可作为毕设项目、课程设计、大作业、工程实训或初期项目立项。 【项目介绍】：本系统是用JSP开发工具实现的，主要完成对学籍的管理，包括添加、修改、删除，查询，以及用户管理等五个方面。系统可以完成对各类信息的浏览、查询、添加、删除、修改等功能。系统的核心是添加、修改和删除三者之间的联系，每一个表的修改都将联动的影响其它的表，当完成添加或删除操作时系统会自动地完成学籍的修改。查询功能也是系统的核心之一，在系统中主要根据学生学号和课程号进行查询，其目的都是为了方便用户使用。系统也有完整的用户添加、删除和密码修改功能。 本系统功能主要划分学生操作管理、管理员操作管理这2大模块。其中学生操作模块包括学籍维护、选课管理、成绩查询、修改密码这几个小模块。管理员操作包括后台学生信息管理、选修课程信息管理、基础课程信息管理、成绩这几个小模块。 在本系统中使用的是SQL Server2000数据库

    本项目属于机器学习的简单部分，基于为了快速理解机器学习而搭建的人工智能速成项目(毕设&课设&实训&大作业&竞赛&项目)

    本项目属于机器学习的简单部分，基于为了快速理解机器学习而搭建的人工智能速成项目，大家可以根据其中的项目时间进行相关的学习.zip项目工程资源经过严格测试可直接运行成功且功能正常的情况才上传，可轻松复刻，拿到资料包后可轻松复现出一样的项目，本人系统开发经验充足（全领域），有任何使用问题欢迎随时与我联系，我会及时为您解惑，提供帮助。 【资源内容】：包含完整源码+工程文件+说明（如有）等。答辩评审平均分达到96分，放心下载使用！可轻松复现，设计报告也可借鉴此项目，该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的。 【提供帮助】：有任何使用问题欢迎随时与我联系，我会及时解答解惑，提供帮助 【附带帮助】：若还需要相关开发工具、学习资料等，我会提供帮助，提供资料，鼓励学习进步 【项目价值】：可用在相关项目设计中，皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面，可借鉴此优质项目实现复刻，设计报告也可借鉴此项目，也可基于此项目来扩展开发出更多功能 下载后请首先打开README文件（如有），项目工程可直接复现复刻，如果基础还行，也可在此程序基础上进行修改，以实现其它功能。供开源学习/技术交流/学习参考，勿用于商业用途。质量优质，放心下载使用。

    2022年研一高级机器学习课程设计.zip（课设&实训&大作业&项目）

    项目工程资源经过严格测试可直接运行成功且功能正常的情况才上传，可轻松复刻，拿到资料包后可轻松复现出一样的项目，本人系统开发经验充足（全领域），有任何使用问题欢迎随时与我联系，我会及时为您解惑，提供帮助。 【资源内容】：包含完整源码+工程文件+说明（如有）等。答辩评审平均分达到96分，放心下载使用！可轻松复现，设计报告也可借鉴此项目，该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的。 【提供帮助】：有任何使用问题欢迎随时与我联系，我会及时解答解惑，提供帮助 【附带帮助】：若还需要相关开发工具、学习资料等，我会提供帮助，提供资料，鼓励学习进步 【项目价值】：可用在相关项目设计中，皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面，可借鉴此优质项目实现复刻，设计报告也可借鉴此项目，也可基于此项目来扩展开发出更多功能 下载后请首先打开README文件（如有），项目工程可直接复现复刻，如果基础还行，也可在此程序基础上进行修改，以实现其它功能。供开源学习/技术交流/学习参考，勿用于商业用途。质量优质，放心下载使用。

    java-ssm947基于JSP的贝儿宠物店管理系统的设计与实现+jsp程序源码数据库含论文.rar

    本系统基于SSM(Spring+SpringMVC+MyBatis)框架,适用于毕业设计， 基于B/S模式, mysql数据库,感兴趣的朋友们可以下载研究一下。 后端采用java语言，ssm框架，mybatis操作数据源，使用软件：idea,eclipse、MySQL。完成了用户登录管理等模块的设计与实现。完成了系统数据库的设计，并基于MySQL数据库管理系统 jdk版本:jdk1.8+ 前端：jsp 开发工具：IDEA 或者eclipse都支持 编程语言: java 框架支持：ssm 数据库: mysql 版本不限 数据库工具：Navicat/SQLyog都可以 详细技术：java+ssm+jsp+MYSQL+MAVEN

    vue+SpringBoot421露营地管理系统设计与实现java毕业设计源码含论文.rar

    jdk版本:jdk1.8+ 前端：vue.js+ElementUI 开发工具：IDEA 或者eclipse都支持 编程语言: java 框架支持：springboot 数据库: mysql 版本不限 数据库工具：Navicat/SQLyog都可以 详细技术：java+springboot+vue+MYSQL+MAVEN 前端采用的Vue框架，后端采用java语言，sprinboot框架，mybatis操作数据源，使用软件：idea,eclipse、MySQL。完成了用户登录管理等模块的设计与实现。完成了系统数据库的设计，并基于MySQL数据库管理系统

    基于java的小型药店管理系统设计与实现.docx

    基于java的小型药店管理系统设计与实现.docx

    基于java的人事管理系统设计与实现.docx

    基于java的人事管理系统设计与实现.docx

    技术栈Spring MVC+ Mybatis+Spring + Jsp+ Tomcat , 是Java Web入门非常好项目

    项目工程资源经过严格测试可直接运行成功且功能正常的情况才上传，可轻松复刻，拿到资料包后可轻松复现出一样的项目，本人系统开发经验充足（全领域），有任何使用问题欢迎随时与我联系，我会及时为您解惑，提供帮助。 【资源内容】：包含完整源码+工程文件+说明（如有）等。答辩评审平均分达到96分，放心下载使用！可轻松复现，设计报告也可借鉴此项目，该资源内项目代码都经过测试运行成功，功能ok的情况下才上传的。 【提供帮助】：有任何使用问题欢迎随时与我联系，我会及时解答解惑，提供帮助 【附带帮助】：若还需要相关开发工具、学习资料等，我会提供帮助，提供资料，鼓励学习进步 【项目价值】：可用在相关项目设计中，皆可应用在项目、毕业设计、课程设计、期末/期中/大作业、工程实训、大创等学科竞赛比赛、初期项目立项、学习/练手等方面，可借鉴此优质项目实现复刻，设计报告也可借鉴此项目，也可基于此项目来扩展开发出更多功能 下载后请首先打开README文件（如有），项目工程可直接复现复刻，如果基础还行，也可在此程序基础上进行修改，以实现其它功能。供开源学习/技术交流/学习参考，勿用于商业用途。质量优质，放心下载使用。

    simulink 电力系统之变压器空投合闸，励磁涌流分析.rar

    1.版本：matlab2014/2019a/2024a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。

Magicbox
Global site tag (gtag.js) - Google Analytics