这次给大家带来微信小程序里怎么做出滚动消息通知效果，微信小程序里做出滚动消息通知效果的注意事项有哪些，下面就是实战案例，一起来看一下。
index.wxml
<!--index.wxml-->
<swiper class="swiper_container" vertical="true" autoplay="true" circular="true" interval="1000">
<block wx:for="{{msglist}}">
<navigator url="/pages/index/index?title={{item.url}}" open-type="navigate">
<swiper-item>
<view class="swiper_item">{{item.title}}</view>
</swiper-item>
</navigator>
</block>
</swiper>
index.js
//index.js
//获取应用实例
var app = getapp()
page({
data: {
},
onload(e) {
console.log(e.title)
this.setdata({
msglist: [
{ url: url, title: 多地首套房贷利率上浮 热点城市渐迎零折扣时代 },
{ url: url, title: 交了20多年的国内漫游费将取消 你能省多少话费？ },
{ url: url, title: 北大教工合唱团出国演出遇尴尬:被要求给他人伴唱 }]
});
}
})
index.wxss
/**index.wxss**/
.swiper_container {
background-color: red;
height: 50rpx;
width: 80vw;
}
.swiper_item {
font-size: 30rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
推荐阅读：
mysql连接池怎样使用事务自动回收（附代码）
angular的浏览器插件batarang使用详解
以上就是微信小程序里怎么做出滚动消息通知效果的详细内容。