歌手详情页:下拉方大歌手图片

1.缩放图片;

1   // 背景图片的缩放
2           let scale = 1
3           const percent = Math.abs(newY/this.imageHeight)//这么计算,图片的高度相当于增加了newY;
4           if(newY > 0){//向下拉的时候
5             scale = 1 + percent
6           }
7           this.$refs.bgImage.style[‘transform‘] = `scale(${scale})`
8           this.$refs.bgImage.style[‘webkittransform‘]  = `scale(${scale})`
9         }

注意:将北京图片的transfomr-origin:top;

原文地址:https://www.cnblogs.com/yangguoe/p/9462610.html

时间: 2024-08-29 22:22:49

歌手详情页:下拉方大歌手图片的相关文章

代码: 两列图片瀑布流(一次后台取数据,图片懒加载。下拉后分批显示图片。图片高度未知,当图片onload后才显示容器)

代码: 两列图片瀑布流(一次后台取数据,无ajax,图片懒加载.下拉后分批显示图片.图片高度未知,当图片onload后才显示容器) [思路]: 图片瀑布流,网上代码有多种实现方式,也有各类插件.没找到合意的,所以根据网上找的一段代码,进行了较大改动. 需引用 zepto 或 jquery. 我这个是应用于手机上的,两列瀑布流,图片高度未知——等图片的onloaded事件触发后,才对容器进行计算和定位. 大容器是 $("#imgList"),容器格子是$(".pin"

京东商品详情页应对“双11”大流量的技术实践

大家来京东打开商品页一般会看到如通用版.闪购.全球购等不同的页面风格,这里面会牵扯到各种各样垂直化的模板页面渲染.以前的解决方案是做静态化,但是静态化一个很大的问题就是页面改版时需要重新全量生成新的静态页.我们有几亿个商品,对于这么多商品,你如果生成页面的话需要跑很多天,而且还无法应对一些突发情况. 比如新的<广告法>,需要对一些数据进行清洗,后端清洗时间和成本来不及,那么很多时候就是从前台展示系统来进行数据过滤.因此需要非常灵活的前端展示架构来支持这种需求. 首先这是我们前端首屏大体的结构.

【转】京东商品详情页应对“双11”大流量的技术实践

原文链接:http://www.csdn.net/article/2015-12-28/2826570 大家来京东打开商品页一般会看到如通用版.闪购.全球购等不同的页面风格,这里面会牵扯到各种各样垂直化的模板页面渲染.以前的解决方案是做静态化,但是静态化一个很大的问题就是页面改版时需要重新全量生成新的静态页.我们有几亿个商品,对于这么多商品,你如果生成页面的话需要跑很多天,而且还无法应对一些突发情况. 比如新的<广告法>,需要对一些数据进行清洗,后端清洗时间和成本来不及,那么很多时候就是从前台

浅谈个人主页头部下拉变大的思路

其实就是在ViewController上先放一个image,就是你想要下拉的时候放大的,然后再放置一个tableView ,并设置 .tableHeaderView=headView 背景为透明色,并且headView的高度比image的高度小点以免在下拉的时候 出现白色不衔接的状态, 如果想要在头部在添加一个签名,个人头像什么的 都可以放在headView上 并且不随着背景图片的变大变小改变, 最主要的就是在滑动单元格的时候 ,控制image的位置,使image看起来就是跟着tableview

listview上拉加载上一页 下拉加载下一页共通处理

先什么都不说了,上效果图: 第一页默认显示: 上拉加载下一页: 拉至一定高度: 松开 加载中: 下拉加载上一页: 下拉至一定高度: 松开 加载中: 代码已经上传:http://download.csdn.net/detail/zengchao2013/8837971 共通的header和footer可以直接使用. 需要传入的三个参数:是否是第一页,是否是最后一页,当前页数 用于header和footer的UI显示,第一页header隐藏,最后一页footer隐藏.

android仿京东、淘宝商品详情页上拉查看详情

话不多说,直接上干货,基本就是一个scrollview中嵌套两个scrollview或者webview;关键点事处理好子scrollview和父scrollview的触摸.滑动事件已达到想要的效果.大体思路就是这样,具体怎么个实现法代码注释比较详细了,由于比较懒,就不多写了,大家看代码有什么不懂的给我留言就是了.对了,开发工具是android studio.点这里下载:

自己定义ViewGroup实现仿淘宝的商品详情页

近期公司在新版本号上有一个须要. 要在首页加入一个滑动效果, 详细就是仿照X宝的商品详情页, 拉到页面底部时有一个粘滞效果, 例如以下图 X东的商品详情页,假设用户继续向上拉的话就进入商品图文描写叙述界面: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" > 刚開始是想拿来主义.直接从网上找个现成的de

自定义ViewGroup实现仿淘宝的商品详情页

最近公司在新版本上有一个需要, 要在首页添加一个滑动效果, 具体就是仿照X宝的商品详情页, 拉到页面底部时有一个粘滞效果, 如下图 X东的商品详情页,如果用户继续向上拉的话就进入商品图文描述界面: 刚开始是想拿来主义,直接从网上找个现成的demo来用, 但是网上无一例外的答案都特别统一: 几乎全部是ScrollView中再套两个ScrollView,或者是一个LinearLayout中套两个ScrollView. 通过指定父view和子view的focus来切换滑动的处理界面---即通过view

基于iscroll实现下拉和上拉刷新

http://www.zhangyunling.com/359.html 重要提示 本插件已经经过更新,查看更新的插件代码,以及介绍请查看:基于iscroll实现下拉和上拉刷新(优化); 在原生APP的开发中,有一个常见的功能,就是下拉刷新的功能,这个想必大家都是知道的,但是原生APP的开发,有一个很大的问题就是,你每次更新一些功能,就要用户重新下载一次版本,尤其是在IOS系统中,新版本还需要经过审核才能通过,这就使得版本的更新受到很大的限制,而如果我们改用网页来展示,那么只要改变服务器中网页的