vue實現動態星空效果

2021-10-05 07:56:32 字數 1210 閱讀 8241

在此之前,要先安裝 less less-loader

webpack.base.conf.js

,,

}]},

index.html

<

!doctype html>

"utf-8"

>

"viewport" content=

"width=device-width,initial-scale=1.0"

>

vue-notes<

/title>

body

<

/style>

<

/head>

>

<

/div>

<

!-- built files will be auto injected --

>

<

/body>

<

/html>

="stars"

>

="star" v-

for=

"(item, index) in starscount"

:key=

"index" ref=

"star"

>

<

/div>

<

/div>

<

/template>

export

default},

mounted()

px` item.style.transform =

`translate3d(0, 0, -

$px) rotatey(

$deg) rotatex(

$deg) scale($,

$)`})}

}<

/script>

"less"

>

@keyframes rotate

100%

}.stars

.star

<

/style>

上一下效果圖

學習一下這裡面的一些知識點(作為一名小白,我只能驚嘆大佬的技術)???

WPF星空效果

原文 wpf星空效果 前陣子看到ay的蜘蛛網效果和知乎的登入頁背景,覺得效果很酷.自己也想寫乙個.於是寫著寫著就變成這樣了.少女夢幻的趕腳有木有.我這有著一顆少女心的摳腳大漢 分為兩個部分 1.星星無休止的漫遊.2.星星之間的連線.星星和連線非別放到兩個容器裡,以便分開操作.星星把星星的運動分解為x...

WPF星空效果

原文 wpf星空效果 前陣子看到ay的蜘蛛網效果和知乎的登入頁背景,覺得效果很酷.自己也想寫乙個.於是寫著寫著就變成這樣了.少女夢幻的趕腳有木有.我這有著一顆少女心的摳腳大漢 分為兩個部分 1.星星無休止的漫遊.2.星星之間的連線.星星和連線非別放到兩個容器裡,以便分開操作.星星把星星的運動分解為x...

vue實現選中效果

好久沒有寫vue了,略有生疏,這個東西還是得多用。下午看到乙個需求,選擇相簿作為輪播圖顯示。介面返回相簿列表,使用者選一下再扔回去。直到我看到e.target.classname我就知道這個事情不簡單。資料驅動這個是我覺得和jquery不一樣的地方。jquery是點一下,加個class,移個clas...