`
xudongcsharp
  • 浏览: 477121 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

(JS特效)鼠标上滚动字体

阅读更多
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>测试滚动上下文字</title>
</head>

<body>
<div id="marquees">
<marquee id="mar" scrollAmount=2 width=300 onmouseover="a()" onmouseout="b()">看我会动啦</marquee>
</div>
<!-- 以下是javascript代码 -->
<script language="javascript">
function a(){
document.getElementById("mar").stop();
}
function b(){
document.getElementById("mar").start();
}
</script>
</body>
</html>



****************************************************

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>鼠标滚动上下文字</title>
<!-- 把下列代码放到<head>区域中-->
<STYLE type=text/css>BODY {
MARGIN: 25px 25px 25px
}
#all TD {
FONT-SIZE: 12px; LINE-HEIGHT: 15px; FONT-FAMILY: "Verdana", "Arial","新宋体", "宋体"
}
INPUT {
FONT-SIZE: 12px; LINE-HEIGHT: 15px; FONT-FAMILY: "Verdana", "Arial","新宋体", "宋体"
}
SELECT {
FONT-SIZE: 12px; LINE-HEIGHT: 15px; FONT-FAMILY: "Verdana", "Arial","新宋体", "宋体"
}
P {
FONT-SIZE: 12px; LINE-HEIGHT: 15px; FONT-FAMILY: "Verdana", "Arial","新宋体", "宋体"
}
TEXTAREA {
FONT-SIZE: 12px; LINE-HEIGHT: 15px; FONT-FAMILY: "Verdana", "Arial","新宋体", "宋体"
}
#all A:active {
COLOR: #7d070c
}
#all A:visited {
COLOR: #7d070c
}
#all A:hover {
COLOR: #336699
}
#all A:link {
COLOR: #7d070c
}
</STYLE>

<script language="JavaScript1.2">
//1) 设置显示的内容
var scroller_msg='欢迎你的光临'
//2) 设置多长时间后才显示滚动的内容

var dismissafter=0

var initialvisible=0

if (document.all)

document.write('<marquee id="curscroll" style="position:absolute;width:150px;border:1px solid black;font-size:14px;background-color:white;visibility:hidden">'+scroller_msg+'</marquee>')

function followcursor(){
if (initialvisible==0){
curscroll.style.visibility="visible"
initialvisible=1

}
curscroll.style.left=document.body.scrollLeft+event.clientX+10

curscroll.style.top=document.body.scrollTop+event.clientY+10

}
function dismissmessage(){
curscroll.style.visibility="hidden"
}
if (document.all){
document.onmousemove=followcursor
document.ondblclick=dismissmessage
if (dismissafter!=0)
setTimeout("dismissmessage()",dismissafter*1000)
}
//-->
</script>
</head>
<body>
</body>
</html>




分享到:
评论

相关推荐

    基于JS的文章按行向上滚动,鼠标经过时停止(间接性)

    "基于JS的文章按行向上滚动,鼠标经过时停止(间接性)"是一种常见的滚动特效,常用于公告、通知或者新闻滚动展示。这种效果使得信息能持续更新,同时在用户需要时提供交互性,避免打扰用户的阅读体验。 首先,我们...

    jQuery数字滚动增加动画特效

    总结起来,jQuery数字滚动增加动画特效是一种结合了jQuery库和digitalScrol.js插件的技术,用于在网页上生动展示动态变化的数字。它通过平滑的滚动动画,使得数据展示更具有吸引力,是现代网页设计中常用的一种视觉...

    javascript经典特效---很酷的文字滚动显示.rar

    JavaScript还可能包含了事件监听器,比如当鼠标悬停在滚动元素上时暂停滚动,移开鼠标时恢复滚动,这需要用到`addEventListener`方法添加事件处理函数。这样的交互性增强了用户体验。 为了实现更复杂的效果,例如...

    CSS3鼠标控制字幕内容滚动特效.zip

    JavaScript特效在这里主要负责交互逻辑的实现。通过JavaScript,我们可以获取和设置DOM元素的状态,比如其样式、位置等,实现动态效果。例如,可以使用`getBoundingClientRect()`方法获取元素相对于视口的位置,再...

    HTML5鼠标滚动海底鱼动画特效.zip

    JavaScript特效则是通过编写自定义代码来实现特定的动态效果。在这个案例中,JavaScript不仅负责处理鼠标滚动事件,还可能包括鱼的行为逻辑,如鱼的游动速度、方向变化、碰撞检测等。通过精心设计的算法,可以让每条...

    与以往不同的跟随鼠标的滚动文字.rar

    在这个名为“与以往不同的跟随鼠标的滚动文字.rar”的压缩包中,我们聚焦于一个独特的JavaScript特效,即鼠标的跟随滚动文字效果。这个效果可以增强用户体验,使网站更具吸引力。 首先,我们来看"JS特效-鼠标特效...

    可滚动,导航特效js

    本知识点将聚焦于“可滚动,导航特效js”,这是一种利用JavaScript实现的导航栏交互效果,它使得网页的导航菜单在用户鼠标滑过时能够滚动并变色,为用户提供更加直观且动态的浏览体验。 首先,我们要理解“滚动”和...

    javascript经典特效---文字滚动导航条.rar

    JavaScript经典特效——文字滚动导航条是一种常见的网页交互设计,它能吸引用户注意力并提供便捷的导航体验。在网页设计中,这种效果常用于顶部菜单、新闻更新或广告展示等区域。本文将深入探讨如何利用JavaScript...

    jQuery鼠标滚动全屏3D翻转动画切换代码.zip

    总结,"jQuery鼠标滚动全屏3D翻转动画切换代码"是一个集动态效果、交互性和视觉设计于一体的解决方案,它展示了jQuery和CSS3在网页特效上的强大能力。开发者可以通过学习和实践这一技术,提升自身在网页开发领域的...

    js悬停滚动文字菜单特效.zip

    【标题】"js悬停滚动文字菜单特效.zip"所包含的知识点主要集中在JavaScript和CSS的交互上,这种特效常用于网站导航菜单,提升用户体验。它实现了当鼠标悬停在菜单项上时,文字以滚动的形式展示,使得长菜单项能在...

    html5+three.js彩色液态流动背景动画特效.zip

    Three.js库通过JavaScript引入,并在此基础上编写自定义的3D动画逻辑。Three.js提供了许多对象和方法,如几何形状、材质、光源、相机和渲染器,用于构建3D场景。在液态流动背景特效中,可能使用了粒子系统或者流体...

    动态文字特效,js文字特效

    "动态文字特效,js文字特效"这个标题暗示我们将探讨如何使用JavaScript实现各种文字动画效果。JavaScript(简称JS)是一种广泛应用于客户端Web开发的脚本语言,它可以赋予HTML元素动态交互的能力,使文字展示更加...

    jQuery实现鼠标滚动页面数字增加动画特效源码.zip

    这个“jQuery实现鼠标滚动页面数字增加动画特效源码.zip”文件,显然包含了一个使用jQuery创建的特殊效果,即当用户滚动页面时,页面上的数字会呈现出动态增加的动画效果。 首先,我们要理解这个特效的工作原理。在...

    云标签特效,三维动态滚动,鼠标控制

    在这个特定的项目中,"云标签特效,三维动态滚动,鼠标控制"是通过JavaScript实现的,为用户提供了一种新颖的交互体验。 首先,我们来详细解释一下这个特效的组成部分: 1. **云标签(Cloud Tags)**:云标签是一...

    网页特效Javascript

    7. **文字类特效**:JavaScript可以改变文本的字体、颜色、大小、动画效果等。例如,可以实现文字逐字显示、闪烁、滚动、颜色渐变等,使文本更具表现力。 8. **专家类特效**:对于高级开发者,JavaScript可以实现...

    不间断上下滚动公告代码.rar

    【标签】"JS特效-滚动代码"指明了实现这种功能主要依赖JavaScript编程语言。JavaScript是一种广泛应用于网页交互的客户端脚本语言,它能够直接在用户浏览器上运行,无需服务器支持。通过JavaScript,开发者可以创建...

    javascript入门特效

    在学习JavaScript特效时,理解DOM(Document Object Model)至关重要。DOM是HTML和XML文档的结构化表示,JavaScript通过操作DOM节点来改变网页内容。例如,我们可以使用`document.getElementById()`、`document....

    JS带缩略图平滑滚动相册特效

    在这个"JS带缩略图平滑滚动相册特效"中,我们将深入探讨如何使用这三种技术构建一个功能完善的相册展示系统。 首先,HTML(HyperText Markup Language)是网页内容的基础结构,负责定义页面上的元素布局和内容。在...

    js文字滚动插件

    在本主题中,我们关注的是"js文字滚动插件",这是一种用JavaScript实现的特效,能够让文本在网页上按照预设的方式自动滚动,如向上或向下间歇滚动,常用于展示新闻公告列表。 制作一个js文字滚动插件,首先要理解...

    智能JS特效菜单导航工具

    在"智能JS特效菜单导航工具"中,JS特效可能体现在菜单项的鼠标悬停效果、点击展开/关闭子菜单、平滑滚动等交互性功能上。 接着,菜单特效是针对网页导航菜单进行的美化和增强,通常结合CSS(层叠样式表)来实现。...

Global site tag (gtag.js) - Google Analytics