5.4 創(chuàng)建星星(獲取屏幕位置與相片墻獲取位置的比較)

坐下來想想不知道最后一次認真的觀賞星星的是哪個時候的事了,接下來我們就來在電腦屏幕上創(chuàng)建星星吧.其實很簡單 . 1 獲取屏幕的寬 高 ;2.for遍歷循環(huán),當然了最終的總數(shù)量還是掌握在自己的手上啊;3我們通過最大的事件源 document 來創(chuàng)建span ,3.1 在css上添加span的樣式以及動畫,hover 4,設置星星的隨機位置 ,4.1 把隨機位置的值 賦給span. 5動畫的時候發(fā)現(xiàn)星星都是統(tǒng)一顯示出來的.那么我們就設置一個隨機數(shù),來延遲動畫 span.style.animationDelay =''+ blockDelay + 's'; ( blockDelay是一個隨機數(shù)) 6.然后我們發(fā)現(xiàn)他們的大小都一樣的,那么我們再給他另外的一個隨機數(shù),用來代表它transform 的時候 不統(tǒng)一 大小 span.style.transform = 'scale('+max_min +')'


圖片.png
圖片.png
最后編輯于
?著作權歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

推薦閱讀更多精彩內(nèi)容

  • Spring Cloud為開發(fā)人員提供了快速構建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 134,993評論 19 139
  • 發(fā)現(xiàn) 關注 消息 iOS 第三方庫、插件、知名博客總結(jié) 作者大灰狼的小綿羊哥哥關注 2017.06.26 09:4...
    肇東周閱讀 12,259評論 4 61
  • 選擇qi:是表達式 標簽選擇器 類選擇器 屬性選擇器 繼承屬性: color,font,text-align,li...
    wzhiq896閱讀 1,806評論 0 2
  • 熙熙攘攘的會場多是九零后剛?cè)肼毜哪贻p教師,感覺今天自己到這里來有些不相適宜了。也許在家自我修行才是正道!
    梧桐瀟雨xt閱讀 194評論 1 0
  • 1、cd /etc/vim 2、sudo vim vimrc 3、光標滑到最下面(不改變原來的配置),添加以下幾行...
    SuperDing閱讀 497評論 0 0