如何在css中把一组静态图片改成动态滚动的图片

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何在css中把一组静态图片改成动态滚动的图片相关的知识,希望对你有一定的参考价值。

在css中修改图片样式,改成滚动图片,怎么改?
增加一个什么属性,还是修改属性?

参考技术A 连续的滚动可以使用css3实现(animat,0%,50%,100%),设置不同时间的图片位置即可。但只是在“滚动”,通常不是大家所称之为的“滚动”(严格说是滑动)。
因此说,你的问题有一定的歧义的。

css3还有一种方法可以实现滚动。就是使用过度效果(transition),他也可以实现滚动的效果。而且,个人感觉比较符合你的意思。

其具体的做法是,给超链接滑过状态一个图片属性,如:
li a img margin-top:0px;
li a:hover img margin-top:-20px;
li a img -webkit-transition: margin-top 0.5s;/*注意这里的hack,照顾多个浏览器*/
这样,鼠标滑上图片,图片就会动画向上滑动20像素,鼠标离开,又滑下来。

再扯下严格意义的【动态滚动的图片】,一般的解释是一组图片可以在某个区域内动画滑动。注意是一组。css通常不具有处理多组图片(也有css模拟动画帧的效果的)的效果。动态滚动图片常见的有2种,一种是可控制的滚动列表,一种是自动无限循环滚动。通常用来作为滚动新闻、组图或相册(风采)使用。追问

用dreamwever建一个css,这样也可以实现么?我用的是dreamwever8

本回答被提问者采纳
参考技术B css滚动不起的,还需要一个叫javascript的东西。
百度:js循环滚动追问

主管就让我在css中改,诶摸不着头脑啊。。。

追答

喊你们主管去死,没js这个滚动不起来的,改css有何用?

追问

额,我们主管自己亲自去改了。。。

追答

你是啥部门的,我很好奇这个,如果是技术部门之类的,那你们那主管还真是个人才

追问

技术部。。。

追答

不知道咋混到主管的,确实是人才啊。

追问

恩 我也觉得

追答

估计被总经理潜规则上位的,哈哈。

追问

额,上海刚回来的大神。。。

以上是关于如何在css中把一组静态图片改成动态滚动的图片的主要内容,如果未能解决你的问题,请参考以下文章

关于CSS的,如何让多个(不确定的个数)图片显示在一行,且有横向滚动条,无纵向滚动条

用css、如何让图片自动适应屏幕大小,不出现滚动条,不变形,兼容各个浏览器?急!!!各位大神帮帮忙

css静态网页背景颜色或者背景图片宽度都不能占满整个网页,右边有很大一块白色的,代码如下图,求解决。

如何在 iOS Chrome 中使用 CSS 滚动捕捉 + 图片错误隐藏滚动条

如何将几张静态JPG图片转化成动态GIF的图片?

外联css样式表中应该如何 写background-image: url()中的图片路径呢 ? 这里我对相对路径不是很明白。把一