??????? 2017年5月3號髓需,值得紀(jì)念的日子刑峡,我注冊了簡書刻肄。接觸這個APP是從一位“百度人”(ps:也不知道這么稱呼合理不合理)那里得知的吻氧,我關(guān)注他的朋友圈溺忧,瀏覽著幾乎每天發(fā)布的文章,是我對前端有了更大的興趣盯孙,也對簡書這個APP也有了更大的吸引力鲁森。在這個平臺上知識是可以共享的,交流的振惰。再次我要發(fā)表我的一個文章歌溉,有不足希望業(yè)內(nèi)人士給出批評和指導(dǎo)。
520馬上來臨骑晶,“單身狗”想要擺脫單身嗎痛垛?想要邂逅你的男神和女神嗎?鄙人簡單做了一個彈幕告白墻透罢,但這也是初級的版本榜晦,僅供參考。
一 羽圃、心形的圖形加載懸掛到頁面的頂部乾胶,呈現(xiàn)一種來回擺動的動畫效果效果
此時運用CSS3中的animation屬性抖剿,對圖片設(shè)置的源代碼如下:
-webkit-animation:bd 5s ease-in-out infinite;/*動畫名稱 動畫完成時間 運動速度 永遠無限*/}
@-webkit-keyframes bd{
0%{-webkit-transform:rotate(30deg); -webkit-transform-origin:center top;}
50%{-webkit-transform:rotate(-30deg);-webkit-transform-origin:center top;}
100%{-webkit-transform:rotate(30deg);-webkit-transform-origin:center top;}
}
transform 屬性向元素應(yīng)用 2D 或 3D 轉(zhuǎn)換。該屬性允許我們對元素進行旋轉(zhuǎn)(ratate)识窿、縮放斩郎、移動或傾斜。
二喻频、給頁面加載音樂
我引用的是告白氣球單曲缩宜,利用<audio src='' id='mymuisc'></audio>,利用js中play()方法控制播放
$(#mymuisc).get(0).play();
對音樂進行控制播放甥温,可以將圖片設(shè)置為一個控制的開關(guān)锻煌,點擊圖片播放音樂,再點擊停止音樂
利用js中的play()和pause()方法
var i=0;
$("img").click(function(){
if (i==0) {
$("#mymusic").get(0).play();
i=1;
} else{
$("#mymusic").get(0).pause();
i=0;
}
});
我后期的音樂播放器也會利用這種方法去控制音樂的播放姻蚓。
今天先寫到這里宋梧,我還要寫畢業(yè)論文呢,明天老師要檢查狰挡,怕怕怕捂龄,又要挨訓(xùn)了,也是對自己的學(xué)過的知識總結(jié)加叁,明天繼續(xù)把告白彈幕寫過的內(nèi)容進行更新倦沧,我寫這個也是預(yù)備給別人告白呢,哈哈哈它匕,妹子有些猛呢展融,很喜歡簡書這個APP,自己的留言板超凳,自己的天地愈污。
???????????????????????????????????????????? the best wish to everyone!