横向
<div id=demo style="overflow:hidden;width:200px;border:2px solid #e0e0e0;padding:2px;" onmouseover="stopscroll();"
onmouseout="doscroll()">
<div id="demo1" style="white-space:nowrap;padding:0;">
<a href="javascript:alert('发表新贴');"><img src="图片URL" height=20 width=104
border=0></a>
<a href="javascript:alert('发表回复');"><img src="图片URL" height=20 width=104
border=0></a>
</div>
</div>
<!--滚动的javascript-->
<script>
var t=demo.scrollWidth
demo1.innerHTML+=demo1.innerHTML
function doMarquee()
{
demo.scrollLeft=demo.scrollLeft<demo.scrollWidth-demo.offsetWidth?demo.scrollLeft+1:t-demo.offsetWidth
}
function doscroll()
{
sc=setInterval(doMarquee,20)
}
function stopscroll()
{
clearInterval(sc)
}
doscroll()
</script>
<!--滚动的javascript结束-->
纵向
<div id="demo" style="height:110px; overflow:hidden ">
<div id="demo1">
<a href="javascript:alert('发表新贴');"><img src="图片URL" height=20 width=104
border=0></a>
<a href="javascript:alert('发表回复');"><img src="图片URL" height=20 width=104
border=0></a>
</div><div id="demo2"></div>
<!--滚动的javascript-->
<script>
var speed=100
demo2.innerHTML=demo1.innerHTML
function Marquees(){
if(demo2.offsetTop-demo.scrollTop<=0)
demo.scrollTop-=demo1.offsetHeight
else{
demo.scrollTop++
}
}
var MyMars=setInterval(Marquees,speed)
demo.onmouseover=function() { clearInterval(MyMars) }
demo.onmouseout=function() { MyMars=setInterval(Marquees,speed) }
zlselect('6');
</script><!--滚动的javascript结束-->
</div>
分享到:
相关推荐
JS无缝图片滚动,横向和横向滚动二例,响应鼠标停止,无使用jQuery,图片滚动应用广泛,本代码在IE8、火狐等浏览器下兼容性好,代码效率高,而且代码也很少,方便大家嵌入到自己的网页中,运行效果如上图所示。
在网页设计中,动态效果是吸引用户注意力的重要手段之一,其中图片的横向和纵向不间断滚动是一种常见的视觉表现手法。这个例子使用了JavaScript库jQuery来实现这一功能,它为开发者提供了便利的操作DOM(文档对象...
**jQuery横向和纵向内容滚动插件Sly** jQuery Sly是一个高效且灵活的插件,用于创建具有创新性滚动效果的网页元素。它支持横向和纵向滚动,为网站内容展示提供了丰富的交互体验。这款插件在实际应用中已被验证,...
在本文中,我们将深入探讨如何使用jQuery来创建一个可滚动的横向和纵向的时间轴幻灯片效果。这个功能常用于展示项目进度、历史事件或重要里程碑,为用户提供一种直观且吸引人的浏览方式。 首先,我们需要了解jQuery...
通过上述步骤,我们可以实现一个具有固定表头且支持横向和纵向滚动的GridView。这种方法不仅提高了用户体验,也使得复杂的数据展示更加简洁明了。此外,这种方法也可以应用于其他类似的场景,如报表展示等。
在本文中,我们将深入探讨如何使用jQuery库来创建平滑的横向和纵向全屏滚动效果。这个主题对于希望提升网站用户体验的开发者来说尤其重要,因为它能够提供一种吸引人的、沉浸式的浏览体验。以下是对实现这一效果所需...
标题中的“横向滚动,纵向滚动 Soldier”可能是指一个JavaScript实现的滚动效果库或者插件,其特点是能够支持页面内容在水平和垂直两个方向上的平滑滚动。这种效果常用于创建富有创意的网页布局,比如全屏滚动网站或...
在本文中,我们将深入探讨经典可重用滑块的实现原理、设计要点以及如何支持横向和纵向切换,同时也会涉及设置背景图片的方法。 滑块组件的基本功能是通过在有限的空间内滑动内容来展示更多的信息。这种组件的设计...
在JavaScript和jQuery的世界里,创建一个具有横向和纵向时间轴切换的幻灯片效果是一项常见的需求,它能够为用户带来动态、交互丰富的展示体验。这种效果通常用于展示一系列按照时间顺序排列的内容,如项目历史、产品...
"Jquery实现图片列表横向和纵向不间断滚动插件实例源码" 这个标题揭示了我们讨论的核心技术是使用Jquery库来创建一个动态效果,特别是针对图片列表的滚动展示。Jquery是一款广泛使用的JavaScript库,它简化了DOM操作...
总的来说,"table横向纵向表头冻结js代码"是网页开发中的一个实用技巧,它提升了用户在查看大型表格时的可读性和交互体验。通过理解基本的实现原理和利用JavaScript的动态更新能力,我们可以轻松地为自己的项目添加...
在这个主题中,我们将深入探讨如何利用 `DIV+CSS` 创建纵向横向下拉菜单以及如何用 `JavaScript` 实现图片文字的横向滚动。 首先,我们来关注 `DIV+CSS` 纵向横向下拉菜单。`DIV` 是HTML中的一个布局容器元素,通过...
Win8风格Metro界面横向滚动导航代码,可向左向右滚动,无限添加内容,也可以切换横向纵向滚动方式,兼容主流浏览器 使用方法: 1、在head区域引入样式表文件metro.css 2、在head区域引入jquery.min.js,jquery....
提供的压缩包文件中,`图片横向不间断滚动.html`和`图片纵向不间断滚动.html`很可能是实现这两个效果的示例代码,而`LTimages`可能包含了用于展示效果的图片资源。通过分析这些文件,可以深入理解并学习这种动态效果...
**JavaScript滚动条实现** 1. **创建元素和结构** 首先,我们需要为滚动内容创建一个容器元素,并设置`overflow`属性为`auto`或`scroll`以启用滚动条。然后,我们可以创建自定义滚动条的HTML结构,如滑块、轨道等...
横向、纵向滚动格式调整 (解决横向滚动换行的问题,无需特殊设置), 彻底解决由于IE问题导致上下滚动页面留白的问题,它可以禁止鼠标控制暂停或继续 (将第9个参数设置为-1或者动态赋值将ScrollSetp设置为-1), 判断...
在本文中,我们将深入探讨如何使用Vue.js框架与Element UI库来实现一个具有横向和纵向拓展功能的表格。Element UI是基于Vue.js的组件库,提供了丰富的UI元素,包括我们在此场景中需要用到的表格(Table)组件。我们...
【标题】"无缝隙图片向上滚动JS代码下载"所涉及的知识点主要集中在JavaScript(JS)编程语言上,尤其是关于图片滚动效果的实现。在网页设计和开发中,为了增加视觉吸引力和用户体验,常会使用JavaScript来创建动态...
本篇文章将详细介绍如何利用JavaScript实现一个Win8风格的横向滚动导航代码,适用于主流浏览器,并且具有无限添加内容和切换滚动方向的能力。 首先,这个项目的核心在于HTML结构的构建,我们需要创建一个容器元素来...