文字跳動特效表白網頁
知識
06-09
效果圖如下：
以下為部分代碼，由於太長就不全部貼出來了，需要完整源碼點擊鏈接獲取，邀請碼填寫：11
[html] view plain copy
- <!DOCTYPE html
>
<html>
<head>
<meta
charset="utf-8"/>
<link
rel="stylesheet" type="text/css" href="main.css"/>
<title>
炫酷文字跳動漂浮
</title>
<script
type="text/javascript">
- function stops(){
- return false;
- }
- document.oncontextmenu=stops;
</script>
</head>
<body>
<article>
<p
class="text" id="text">
當你需要我的時候，我都會在這裡；
- 當你有麻煩的時候，我都會在你身邊；當你覺得孤獨的時候；
- 當你認為所有的人都已絕望；
- 到我這裡來，我會給你所有的愛。
- 可能遇見你，對我來說是最大的幸福。
- 有了你，我的生涯變的無窮廣闊，有了你，世界變得如斯迷人。
- 你是世界，世界是你。
- 我樂意用本人的心，好好的陪著你，愛著你。
- 陪你到你想去的處所，居心走完咱們人生的餘下的旅程。
- 在將來的日子裡，興許什麼都無奈斷定，但獨一能夠肯定的是，我愛的人是你，無論當初仍是未來，我想我這裡都會是你最暖和的港灣，都是為你遮風避雨的城牆。
- 你悄悄為我做的一切，天地知曉，我知曉！為這悄悄柔柔的溫情，在滾滾紅塵，我不怕紅顏老褪，總在期待中度過慢慢長夜，可不後悔。
- 讓我陪著你，上天送厚禮，沒有華麗的言語，表達真摯的情誼，只有一顆心，永恆為你跳起，那是我真實的感受，無論白天黑夜時刻牽掛著你,
- 我愛你。
</p>
<button
id="btn" ele-range>
我也愛你</button>
</article>
<script
src="text.js" type="text/javascript" charset="utf-8"></script>
<script
type="text/javascript">
- var resetbtn = document.getElementById("btn");
- var neontext = new Neontext("text");
- var btn = new Neontext("btn");
- neontext.render.run();
- btn.render.run();
- resetbtn.addEventListener("click",function(){
- neontext.render.killer();
- btn.render.killer();
- })
</script>
<audio
autoplay="autoplay"><source
src="http://www.hunlipic.com/love/you/img/yinyue.mp3" type="audio/mpeg"/></audio>
</body>
</html>
TAG:程序員小新人學習 |