摘要:需求描述接到的需求是這樣的跑馬燈效果一次展示一行文字循環滾動文字滾動到視野中停留一秒后滾出。
需求描述
接到的需求是這樣的:跑馬燈效果 一次展示一行文字 循環滾動 文字滾動到視野中停留一秒后滾出。
靜態效果如下圖,文字從下往上或者從右往左滾動,滾動到此位置時停留一秒(不會傳動圖...
網絡上有比較多的多行文字循環滾動的demo,找了一下好像能滿足單行并且可停留一秒的比較少(emmm可能我沒認真找
下面貼出我的最終解決方案。
使用一個定時器 不斷改變最外層div的scrollTop,為了能循環滾動,增加一個與con1一樣的con2
PS:這里的time選用1000/60是因為想要模擬window.requestAnimationFrame(一般1000ms60幀,當然了,你也可以直接使用requestAnimationFrame代替setInterval,效果更好
水平方向滾動單行文字垂直跑馬燈效果
- 測試1號
- 測試2號
- 測試3號
- 測試4號
水平方法滾動的具體實現其實跟垂直方向類似的,不同的是要改變的是容器的scrollLeft
單行文字水平跑馬燈效果 測試1號測試2號測試3號測試4號測試5號測試6號
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/108030.html
摘要:前言原生開發小程序有了兩個項目,在原生開發小程序經驗技巧方面有一些自己的總結,此篇文章做原創分享本文適合老手查看,新手請參閱官方文檔,同步至。 前言 原生開發小程序有了兩個項目,在原生開發小程序經驗技巧方面有一些自己的總結,此篇文章做原創分享! 本文適合老手查看,新手請參閱官方文檔,同步至github。 1.發布訂閱處理復雜邏輯 支持先訂閱后發布,以及先發布后訂閱 方法源碼 var E...
摘要:設置控件中內容的位置,如上表示居中。為文本指定輸入法,需要完全限定名完整的包名。在指定的情況下,設置重復滾動的次數,當設置為時表示無限次。限制顯示的文本長度,超出部分不顯示。 前言 大家好!在前幾篇文章里,我們詳細介紹了Android中的常用布局,使大家對Android中的頁面布局有了一定認識,而對于布局中使用的一些UI控件如Button、TextView等,有的讀者可能還存在一些困惑...
摘要:測試文字若子元素定高,結合絕對定位的盒模型屬性,實現居中效果測試文字關于增加層級的說明在水平居中對齊中,元素外層套一層并設置,元素設置負或者的負屬性,可以實現水平居中的效果。 行高line-height實現單行文本垂直居中 以前一直認為單行文本垂直居中要將高度和行高設置成相同的值,但高度其實沒必要設置。實際上,文本本身就在一行中居中顯示。在不設置高度的情況下,行高撐開高度。 .tes...
摘要:基于這樣的布局方式,你就可以把什么定高不定高定寬不定寬多行單行的水平垂直居中都搞定了。且不支持這就是所謂的布局大法。 看了這篇文章,你可以了解到以下布局方法: table-cell 定高水平垂直居中 不定高水平垂直居中 單行定高水平垂直居中 單行不定高水平垂直居中 多行定高水平垂直居中 多行不定高水平垂直居中 多列等高布局 左邊定寬右邊自適應布局 左邊右邊定寬中間自適應三列布局 最...
閱讀 2572·2021-09-23 11:21
閱讀 1882·2021-09-22 15:15
閱讀 970·2021-09-10 11:27
閱讀 3440·2019-08-30 15:54
閱讀 651·2019-08-30 15:52
閱讀 1335·2019-08-30 15:44
閱讀 2349·2019-08-29 15:06
閱讀 2972·2019-08-28 18:21