让网页标签页头部有新消息提醒和Title标题文字滚动显示效果
小黑 HTML相关2021-12-24
CSS实现鼠标移入显示滚动条,移出隐藏滚动条
网页基本结构:!DOCTYPE htmlhtml lang="zh-CN"headmeta charset="utf-8"meta http-equiv="X-UA-Compatible" content="IE=edge"meta name="renderer" content="webkit"meta name="viewport" content="w
小黑 CSS相关2021-04-16
JS实现div随屏幕滚动到一定高度后固定
在有些网页中我们会发现会有这样的现象:某个div会随着屏幕的滚动达到一定高度的时候位置就固定下来了。例如淘宝的导航条:那么这里就需要用到JS的逻辑方法来实现了。下面是HTML代码简单实现:(记得加总JS才能运行哦)!DOCTYPE htmlhtmlheadmeta http-equiv="Content-Type" content="text/html; charset=utf-8"/style type="text/css"body{width
小黑 JS相关2019-02-25
jQuery实现页面滚动时顶部动态显示隐藏
很多时候你会看到页面上有一个始终固定在网页顶部的导航菜单,当页面向下滚动的时候,导航菜单动态隐藏,页面滚动到顶部时,导航菜单动态显示,淘宝也采用过此效果,很不错,当然,里面使用了CSS3动画效果,不支持低版本浏览器。代码相当的简单,只需几行就搞定。div class="nav-top"/divstyle.nav-top{background: #f7f7f7;color:white;font-size:24px;padding:30px;text-align:center;positi
小黑 JS相关2018-09-17
H5移动端获奖无缝滚动动画实现
哈哈,上动态图真的是一下就明了了。就是滚动么滚动,那么制作这个有什么方法呢?我们来总结一下:html骨架其实很简单,最外面的div是做固定的窗口,里面的ul控制运动,li里面是展示动画div class="roll" id="roll"ul li第一个结构/li li第二个结构/li li第三个结构/li li第四个结构/li li第五个结构/li li第六个结构/li li第七个结构/li li第八个结构/li/ul/div基本css样式先把基本的css样式实现*
小黑 JS相关2018-09-12
新闻列表单行多行简洁向上滚动js效果
常用的新闻列表单行滚动js效果,也可用作多行滚动js效果,超简洁的Js特效。在本例中如果需要单行滚动,只需要把css中#div1的值改为18即可。注:经测试兼容Ie6、7、8,FF以及谷歌浏览器!!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"htmlheadtitle新闻列表单行滚动js效果和多行滚动j
小黑 网页特效2018-09-02
侧边栏跟随屏幕滚动效果
侧边栏跟随屏幕滚动效果,现在已经很流行了。尤其是博客跟资讯类网站,在主页面比较长的情况下,侧边栏跟随屏幕滚动,能够极大的增加用户粘度,提高网站pv的。所以在此推荐这个经典js特效。这个效果的用法很简单,引入js,在侧边栏写一个div,加上id:sidebar-follow。在里面写内容即可。注意事项:一、id=”sidebar-follow”。这个div上面好像必须得有内容。二、需要给id:sidebar-follow加上一个宽度,宽度一般跟侧边栏宽度一样。三、这个特效是原生js的。原生特效用法请参考下面
小黑 网页特效2018-09-02