小程序中公告消息左右滚动跑马灯效果

最新推荐文章于 2024-08-16 23:32:07 发布

qq_34262521

最新推荐文章于 2024-08-16 23:32:07 发布

阅读量1w

点赞数 1

本文链接：https://blog.csdn.net/qq_34262521/article/details/79354816

版权

wxml如下：

 
  < 
  view 
  class= 
  'scroll_view_border'> 
 
  < 
  view 
  class= 
  "srcoll_view" 
  bindtap= 
  "textclick">这武器那都好，就是不吃药只能战斗15秒，15秒内不是你死就是我亡，这才是90级史诗该有的王者风范! 
  </ 
  view 
  > 
 
</view>
wxss如下：
 
   .srcoll_view{ 
  
   position: 
   absolute; 
  
   top: 
   0 
   rpx; 
  
   height: 
   100 
   rpx; 
  
   font-size: 
   30 
   rpx; 
  
   white-space: 
   nowrap; 
  
   line-height: 
   100 
   rpx; 
  
   color: 
   #00bff3; 
  
   animation: 
   myfirst 
   20s 
   linear 
   infinite; 
  
    } 
  
   @keyframes 
   myfirst 
  
    { 
  
   0% { 
   margin-left: 
   750 
   rpx;} 
  
   100% { 
   margin-left: 
   -1500 
   rpx;} 
  
    } 
  
   .scroll_view_border{ 
  
   position: 
   relative; 
  
   width: 
   100%; 
  
   background: 
   rgba( 
   0, 
   0, 
   0, 
   0.2 
   ); 
  
   height: 
   100 
   rpx; 
  
   overflow: 
   hidden; 
  
    } 
  
js------没有