scroll-view和swiper的使用
源码:
<template>
<viex class="out">
<view class="box">div</view>
<view class="block"></view>
<icon type="success" size="26"></icon>
<icon type="waiting" size="26"></icon>
<view>uniapp</view>
<view>web前端开发</view>
<text user-select selectable=>nodejs span</text>
<text space="emsp" decode>vue</text>
<scroll-view class="scroll" scroll-x scroll-y>
<view class="group">
<view class="item">
111
</view>
<view class="item">
111
</view>
<view class="item">
111
</view>
<view class="item">
111
</view>
<view class="item">
111
</view>
<view class="item">
111
</view>
</view>
</scroll-view>
<swiper class="swiper" circular autoplay interval="3000" duration="1000">
<swiper-item class="item">
<image src="../../static/25-1G115103JD30.jpg" mode=""></image>
</swiper-item>
<swiper-item class="item">
<image src="../../static/165804312036816580431202.jpg" mode=""></image>
</swiper-item>
<swiper-item class="item">
<image src="../../static/logo.png" mode=""></image>
</swiper-item>
</swiper>
</viex>
</template>
<script>
export default {
}
</script>
<style lang="scss">
.out{
.box{
width: 200rpx;
height: 220rpx;
background:pink;
}
.block{
width: 750rpx;
height: 200rpx;
background-color: black;
}
}
.scroll{
height: 100rpx;
width: 220rpx;
border: 1px solid red;
box-sizing:border-box;
.group{
white-space: nowrap;
.item{
width: 220rpx;
height: 220rpx;
background-color: royalblue;
display: inline-block;
margin-right: 10rpx;
}
}
}
.swiper{
}
</style>
属性:

swiper:属性:image


scroll-view和swiper的使用的更多相关文章
- scroll calendar & scroll view
scroll calendar & scroll view https://taro-docs.jd.com/taro/docs/components/viewContainer/scroll ...
- NGUI之scroll view制作,以及踩的坑总结
http://blog.csdn.net/monzart7an/article/details/23878505 链接: http://game.ceeger.com/forum/read.php?t ...
- NGUI例子Scroll View场景中item添加点击后自动滑到终点
http://blog.csdn.net/luyuncsd123/article/details/22914497 最近在做一个项目的UI,需求是1.拖动items后当永远有一个item保存在中间位置 ...
- NGUI系列教程十(Scroll View实现触摸滚动相册效果)
NGUI中提供了两种Scroll View 一种是通过手指或鼠标滑动视图时移动平面物体,另一种则是直接移动摄像机,他们各有各的好处.但是NGUI提供的Scroll View很难实现类似Android ...
- Scroll view 备忘
Stroyboard中使用ScrollView 当我们使用Storyboard开发项目时,如果要往控制器上拖入一个ScrollView并且添加约束设置滚动区域,是有特殊的规定的: 拖入一个scroll ...
- Unity NGUI制作scroll view
unity版本:4.5 NGUI版本:3.6.5 参考链接:http://blog.csdn.net/monzart7an/article/details/23878505,作者:CSDN 冬菊子 ...
- Scroll View 控件以Thumbnail的方式显示一个目录的全部图片,相似图片浏览器
MAC : XCode -> Scroll View 控件以Thumbnail的方式显示一个目录的全部图片,类似图片浏览器 STEP1:将两个目录复制到project里面ImageBrowser ...
- Scroll View 深入
转载自:http://mobile.51cto.com/hot-430409.htm 可能你很难相信,UIScrollView和一个标准的UIView差异并不大,scroll view确实会多一些方法 ...
- 全面理解iOS开发中的Scroll View[转]
from:http://mobile.51cto.com/hot-430409.htm 可能你很难相信,UIScrollView和一个标准的UIView差异并不大,scroll view确实会多一些方 ...
- (转)ngui3.5.7 版本Scroll View实现方法
原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://xyo123.blog.51cto.com/6369437/1405861 现在网 ...
随机推荐
- ENVI+ERDAS实现Hyperion叶绿素含量反演:经验比值法、一阶微分法
本文介绍基于ENVI与ERDAS软件,依据Hyperion高光谱遥感影像,采用经验比值法.一阶微分法等,对叶绿素含量等地表参数加以反演的具体操作. 目录 1 前期准备与本文理论部分 1.1 几句闲谈 ...
- 银河麒麟SP2 auditd服务内存泄露问题
这几天遇到基于海光服务器的银河麒麟V10 SP2版本操作系统出现内存无故增长问题. 排查发现auditd服务,占用了大量内存. 我的环境是银河麒麟V10 SP2 524,audit版本audit-3. ...
- 如何对MongoDB进行测试
一.环境搭建 关于环境搭建,最好的搭建方式,当然是脚本一键式搭建 我这里是centos6 x64版本的linux上进行构建,这个linux版本现在应该是大部分的主流服务器的标配版本 下面是安装脚本的编 ...
- nmcli 命令设置网络
nmcli 命令设置网络 设置静态 IP 地址 sudo nmcli connection modify "连接名称" ipv4.addresses IP地址/子网掩码 设置网关 ...
- LeetCode 周赛上分之旅 #47 前后缀分解结合单调栈的贡献问题
️ 本文已收录到 AndroidFamily,技术和职场问题,请关注公众号 [彭旭锐] 和 BaguTree Pro 知识星球提问. 学习数据结构与算法的关键在于掌握问题背后的算法思维框架,你的思考越 ...
- 10. 用Rust手把手编写一个wmproxy(代理,内网穿透等), HTTP内网穿透支持修改头信息
用Rust手把手编写一个wmproxy(代理,内网穿透等), HTTP内网穿透支持修改头信息 项目 ++wmproxy++ gite: https://gitee.com/tickbh/wmproxy ...
- 想让你的代码简洁,试试这个SimpleDateFormat类高深用法
本文分享自华为云社区<从入门到精通:SimpleDateFormat类高深用法,让你的代码更简洁!>,作者:bug菌. 环境说明:Windows 10 + IntelliJ IDEA 20 ...
- 基于LangChain的LLM应用开发3——记忆
此情可待成追忆,只是当时已惘然.我们人类会有很多或美好或痛苦的回忆,有的回忆会渐渐模糊,有的回忆午夜梦醒,会浮上心头. 然而现在的大语言模型都是没有记忆的,都是无状态的,大语言模型自身不会记住和你对话 ...
- js数据结构--集合
<!DOCTYPE html> <html> <head> <title></title> </head> <body&g ...
- .NET中的数组在内存中如何布局?
总的来说,.NET的值类型和引用类型都映射一段连续的内存片段.不过对于值类型对象来说,这段内存只需要存储其字段成员,而对应引用类型对象,还需要存储额外的内容.就内存布局来说,引用类型有两个独特的存在, ...