滚动条变色 隐藏滚动条与双击网页自动滚屏显示代码

安装U盘里下载的“滚动条变色”插件，

安装到DW后，如何正常应用该特效插件？
答：打开DW ，
1、新建页面——代码——删除<html>前面的所有代码！
2、鼠标定位在<head>之后——点击DW“设计”——点击“滚动条变色”插件，进行设置。
滚动条代码英文翻译：arrow——箭头，track——轨道。
提示：如果插入以下代码不能变色，请把网页头部<html>前的多于代码删除即可！

滚动条变色：

也可以直接在网页的<head> </head>之间输入以下代码，就可以随意变色了：


代码如下:

<style>
body {SCROLLBAR-FACE-COLOR:#3333FF;(立体滚动条凸出部分的颜色)
SCROLLBAR-HIGHLIGHT-COLOR:#505050;(滚动条空白部分的颜色)
SCROLLBAR-SHADOW-COLOR:#fc2400;(立体滚动条阴影的颜色)
SCROLLBAR-ARROW-COLOR:#666666;(上下按钮上三角箭头的颜色)
SCROLLBAR-BASE-COLOR:#333333; (滚动条的基本颜色)
SCROLLBAR-DARK-SHADOW-COLOR:#b4fc48} (立体滚动条强阴影的颜色)
</style>

后面的16位颜色值你可以随意更改，括号内是解释说明，在输入时请不要插入。

隐藏滚动条：

在任何情况下，如果网页超出显示范围，就会出现滚动条。但有时我们并不想让它显示，如何隐藏它呢？只需在<body> </body>之间插入代码：<body style="overflow-x:hidden;overflow-y:hidden">即可。其中x表示水平滚动条，将其改为y的话就可以隐藏垂直滚动条。

双击网页滚屏显示：

当网页中有长篇文章时，浏览起来就比较吃劲了，想想一边忙着拖动滚动条，一边忙着浏览，确实挺累人的。为了客人能够轻松的浏览，我们可以使用script代码实现网页的自动滚屏，当双击网页的时候，网页将会自动向下滚动，再次单击时滚动停止。将下面的代码插入到<body> </body>之间。


代码如下:

<script language"javascript">
var currentpos,timer;
function initialize()
{
timer=setInterval("scrollwindow()",10);
}
function sc(){
clearInterval(timer);
}
function scrollwindow()
{
currentpos=document.body.scrollTop;
window.scroll(0,++currentpos);
if (currentpos != document.body.scrollTop)
sc();
}
document.onmousedown=sc
document.ondblclick=initialize
</script>

注意：上面代码都是非标准模式的。

赞 (0)

相关推荐

  • 滚动条变色 隐藏滚动条与双击网页自动滚屏显示代码

    安装U盘里下载的"滚动条变色"插件, 安装到DW后,如何正常应用该特效插件? 答:打开DW , 1.新建页面--代码--删除<html>前面的所有代码! 2.鼠标定位在<head>之后--点击DW"设计"--点击"滚动条变色"插件,进行设置. 滚动条代码英文翻译:arrow--箭头,track--轨道. 提示:如果插入以下代码不能变色,请把网页头部<html>前的多于代码删除即可! 滚动条变色: 也可以直接在网

  • jQuery实现公告新闻自动滚屏效果实例代码

    本文是小编参考网络上的一个小demo,自己做了下扩展,原来是向上滚动的,扩展了一个向下滚动的方法,具体实例代码如下所示: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>滚屏实验</ti

  • PYQT5设置textEdit自动滚屏的方法

    在修改后的文字后面加上: self.textEdit_6.moveCursor(QTextCursor.End) 例子: self.textEdit_6.setPlainText("Hello World") 以上这篇PYQT5设置textEdit自动滚屏的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.

  • 易语言在画板中写出指定文本当画板中已满会自动滚屏

    易语言在画板中写出指定文本当画板中已满会自动滚屏

    滚动写行方法 英文命令:sprint 操作系统支持:Windows    所属对象:画板 在当前写出位置写出指定的文本.数值.逻辑值或日期时间,并将现行写出位置调整到下行行首.如果现行画板高度无法容纳当前所要写出的行,则自动向上滚动画板内容. 语法:  无返回值  画板．滚动写行 (［欲写出数据］,- ) 例程 说明 通过"滚动写行"命令向画板中写入一行指定文本,本命令与"写文本行"不同的是,当画板中已满时"滚动写行"命令会自动滚屏. 运行结果:

  • 网页全屏显示代码说明分析

    最常见的是使用window.open的方法,直接打开全屏网页: [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 另外,如果想让已经打开的网页全屏,有以下两种方法: 1.使用ActiveX test function Fkey(){ var WsShell = new ActiveXObject('WScript.Shell') WsShell.SendKeys('{F11}'); } to full [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 2.使用window.o

  • 微信小程序 scroll-view隐藏滚动条详解

    微信小程序 scroll-view隐藏滚动条详解

    一:scroll-view隐藏滚动条 在书写网页的时候,往往会为了页面的美观,而选择去掉滚动区域默认的滚动条,而在这里,就是为小程序去掉滚动条的其中的一种方法: scroll-view.wxml: scroll-view.wxss scroll-view.js 最终显示效果如下; 注意: (1)不能在scroll-view中使用textarea,mao,canvas,video组件 (2)scroll-init-view的优先级高于scroll-top (3)onPullDownRefresh事

  • iframe高度自适应及隐藏滚动条的实例详解

    iframe高度自适应及隐藏滚动条的实例详解 在工作中,我们可能会遇到自己公司和其他的公司达成合作关系,从而共同开发某个项目.而这时候,我们可能就需要在自己的网站上嵌入别人做好的页面.而这种情况下,我们一般都会选择去使用iframe达到我们的目的.但是iframe用起来,真的是让人头痛,高度无法控制,难看的滚动条等等,下面我分享一下自己在处理iframe时的一些心得. 高度自适应 <iframe src="http://huichang.qunar.com/huiQunar" i

  • 用js控件div的滚动条,让它在内容更新时自动滚到底部的实现方法

    如下所示: <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> </head> <body> <script type="text/javascript"> funct

  • layer.js open 隐藏滚动条的例子

    我就废话不多说了,直接上代码让大家看看吧! $('img.echart-trand').click(function() { var host = $(this).data('host'); var role = $(this).data('role'); console.log('host',host); console.log(window.width); var labeltitle = host; if(role==4)labeltitle = $(this).data('title')

  • 微信小程序scroll-view隐藏滚动条的方法详解

    效果图: 1.scroll-view 中的需要滑动的元素不可以用 float 浮动使其一行展示: 2.包裹scroll-view的元素如果用 display:flex; 是没有滚动效果的: 3.scroll-view 中的需要滑动的元素要用 dislay:inline-block; 进行元素的横向编排: 4.包裹 scroll-view 的元素要加上样式–> overflow:hidden;white-space:nowrap; 5.有时候为了美观要隐藏滚动条,需要在样式里加上 核心代码: 在w

随机推荐