代理加盟 2019全新代理计划 赚钱+省钱双管齐下,独立平台,丰厚利润!

您现在的位置: 秀站网 > 站长学院 > 建站教程 >

提取图片主颜色作背景色自动换色JS

来源:未知 发布时间:2019-03-30热度: ℃我要评论
网站的全通轮播图的方法很多,有些图片做成非常宽(宽大于1200px)。其实没必要得很大,京东、淘宝等平台的轮播图采用JS自动获取图片的主颜色作背景色。这属于图片优化细节,有如下优点 ①最大程度地减小图片尺寸和大小,减少网页加载时间; ②用户体验自适应好,图片中...

崖柏造假过程模板秀站淘宝店开业,好礼送不停

? ? ? ?网站的全通轮播图的方法很多,有些图片做成非常宽(宽大于1200px)。其实没必要得很大,京东、淘宝等平台的轮播图采用JS自动获取图片的主颜色作背景色。这属于图片优化细节,有如下优点

①最大程度地减小图片尺寸和大小,减少网页加载时间;

②用户体验自适应好,图片中文字大小合适并不出现横滚动条;

③便于编辑管理,采用新的图片不需要更改模板CSS样式;

④主流浏览器都兼容性。

全通轮播图效果展示

? ? ? ?参考重庆装修公司www.v25j.com主页轮播图。

获取轮播图图片主色JS

? ? ? ?运用jquery.adaptive-backgrounds.js用来实现这个功能,这个插件能提取图片的主色,并把它作为其父元素的背景色。

? ? ? ?另外一种实现方法参考《DedeCMS列表页实现隔行多行随意换色》。

结合SuperSlide,HTML实例

? ? ? ?对应的JS下载链接:http://pan.baidu.com/s/1gfzDOiB 密码:yu55



自动获取图片主颜色作轮播图背景色(superslide)







 

  • 1
  • 2
  • 3

本文地址:https://www.xiuzhanwang.com/news/1413.html

    责任编辑:秀站网

    发表评论

    评论列表(条)