Welcome! 登入 註冊
專區首頁 專區百科 專區論壇 專區部落格 專區地圖

Advanced

Re: [作業05] jQuery動態網頁初探-fadein

[作業05] jQuery動態網頁初探-fadein

1. jQuery動態網頁初探講義


請參考
[講義] jQuery講義
http://mepopedia.com/forum/read.php?1497,45619


[hr]

2. jQuery動態網頁初探作業說明影音


http://youtu.be/ScKyR0mrh1s



[hr]

3. 作業步驟

1.修改期中作業檔案,使#main產生fadein效果
2.學習重點
<head> <!--jQuery 語法--> <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css"> <script src="http://code.jquery.com/jquery-1.10.2.js"></script> <script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script> <script> $(function() { $( "#main" ).hide(); $( "#main" ).fadeIn(2000); }); </script> </head> 3.直接以期中作業首頁或某一頁面繳交即可。
作業網址為http://mepopedia.com/~css104-2c/midterm/midterm-1045445XXX 。

並請回覆:

(1)作業網址:
(2)製作心得:
學號

[hr]
請於規定時間準時繳交作業,逾期不後。
[hr]



Edited 1 time(s). Last edit at 04/13/2017 10:02AM by JinJin.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445189
(2)製作心得: 我通通都有加,覺得還蠻簡單的,效果也不錯

(1)作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1045445212/works.html
(2)製作心得:很簡單很開心



Edited 1 time(s). Last edit at 04/13/2017 11:49PM by 1045445212.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445117

(2)製作心得: 淡入效果分別呈現在主頁及旅遊簡介,在部分區塊適當的加入效果,
可謂畫龍點睛,主頁的視覺畫面也有了變化,會選這兩頁,主要想呈現這兩個頁面
自己的想法是較希望引起觀者對於頁面的目光,有些網頁內容較豐富的網站,這樣
呈現也能使某個區塊更加突出,效果甚好。



Edited 2 time(s). Last edit at 04/13/2017 10:37PM by 松本.豪.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1045445003
只有 index 和 about 有做 fadein~

(2)製作心得:雖然認識了jquery很高興,但還是研究不出如何讓錨點連結有滑動的效果
附上可以理解但難以代入的教學網址:[url=http://www.astralweb.com.tw/jquery-sliding-anchor/]http://www.astralweb.com.tw/jquery-sliding-anchor/[/url]  _sad smiley´ཀ`」 ∠):_



Edited 2 time(s). Last edit at 04/14/2017 05:16PM by 朱盈穎.
(編輯記錄)

作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1045445036/topp.html
心得:已經在index加上fadein了,但還想在加些什麼到網頁上,上網研究了一些,但有些是太複雜,有些全英文看不懂~
希望老師可以介紹更多關於jquery的探索~很期待~smiling bouncing smiley



Edited 2 time(s). Last edit at 04/14/2017 10:50PM by Peiwei.
(編輯記錄)

(1)作業網址:http://mepopedia.com/~css104-2c/midterm/midterm-1045445201

(2)製作心得:很簡單超簡單



Edited 1 time(s). Last edit at 06/15/2017 11:53AM by 113039.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445162

(2)製作心得:
其實本來想嘗試一下jQuery的其他功能,但試了一下發現把自己設定的CSS都給弄得很混亂就放棄了confused smileyXDDD
在首頁和第四頁裡加入了淡入的效果、很滿意!!
雖然依自己的能力現在也只能用到淡入效果,但期待之後課程老師教我們更多jQuery的語法和調整!!!!!!!!!!!



Edited 1 time(s). Last edit at 04/14/2017 11:56PM by j29927381.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445120

(2)製作心得:
yeah~學到新的功能─jQuery~以後可以再運用在隻後座的網頁裡了

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445174
(2)製作心得: 有點難~

作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1045445180
製作心得: 覺得很好玩 雖然我只有改第一頁



Edited 3 time(s). Last edit at 04/19/2017 11:27PM by 時尚時尚最時尚.
(編輯記錄)

作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1045445015
製作心得:我是做1~4頁面的地方 因為前面主要強調作者喜愛的插畫 後面則是另一個攝影作品 所以只有以前面的這幾頁以漸進方式淡出 使他們的風格規劃一致讓畫面跳脫出來~~



Edited 2 time(s). Last edit at 04/19/2017 11:37PM by 王宜雯.
(編輯記錄)

1)作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1045445072

只有 index 有做 fadein

(2)製作心得:淡出淡入的功能好方便 すごーい!
做的時候感覺たーのしー!

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1055999320
(2)製作心得: 看起來很難得樣子,我還認真的看了那段視屏教程......額看到後來發現就是把語法複製進去啦,所以這個作業完成的超快,但是只做了首頁。

作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1045445135

製作心得:我是做第一頁的地方,淡入的效果覺得很酷!

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445033
(2)製作心得: 還蠻簡單的,效果又不錯滿合胃口的

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445069
(2)製作心得: 覺得只有index的main比較適合fadein而已,淡入的效果很棒

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445141
(2)製作心得:還不賴r

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445195
(2)製作心得: 我只在第一頁上加了效果,覺得還挺簡單的。

(1)作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1045445198
(2)製作心得:無

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445045
(2)製作心得: 這個效果很好玩很酷

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445042
(2)製作心得: 沒有語法的話做不出來,很酷。

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445027
(2)製作心得: 只有在index加,看他跑出來好療愈xD

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445009
(2)製作心得: 覺得很快也滿簡單的,效果也很好看,可是不知道為甚麼我的區塊背景色會跑掉,明明是值都一樣ㄋ



Edited 1 time(s). Last edit at 06/08/2017 07:55AM by 1045445009.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445138
(2)製作心得: 學到更多網頁不同的做法



Edited 2 time(s). Last edit at 05/19/2017 08:06PM by 1045445138.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445186
(2)製作心得: 只有首頁有加 其他頁沒有

作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1045445150

製作心得:我是以首頁做fadein的效果,感覺還不錯

作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1025445061
製作心得:我只有首頁有做,做完感覺效果不錯!

(1)作業網址: http://mepopedia.com/~css104-2c/midterm/midterm-1045445198
(2)製作心得: 無

(1)作業網址: http://mepopedia.com/~css104-2c/midterm/midterm-1045445108。

(2)製作心得:簡單
學號 1045445108

http://mepopedia.com/~css104-2c/midterm/midterm-1045445108。

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445108/works.html
(2)製作心得: 簡單
學號 1045445108

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445019/


(2)製作心得: 還蠻好玩的!!

作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1045445081/index.html

製作心得:看了介紹影片才了解JQuery是怎麼使用的了

(1)作業網址: http://mepopedia.com/~css104-2c/midterm/midterm-1045445030

(2)製作心得:因為很簡單 所以做得很開心哈哈哈 但嘗試做其他功能 發現真的難很多 之後要再花時間研究

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445099

(2)製作心得: 做第一頁的地方,淡入的效果很棒spinning smiley sticking its tongue out



Edited 2 time(s). Last edit at 06/06/2017 04:04AM by 簡瑜萱.
(編輯記錄)

(1)作業網址:file:///C:/Users/Administrator/Desktop/%E7%B6%B2%E9%A0%81%E8%A8%AD%E8%A8%88/midterm-1045445051/index.html
(2)製作心得:好玩好玩。

> (1)作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1045445051/
> (2)製作心得:好玩好玩。

(1)作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1045445057/
(2)製作心得:算簡單的一個作業,淡入好美thumbs up



Edited 1 time(s). Last edit at 06/07/2017 06:17PM by weiwei.
(編輯記錄)

作業網址:http://mepopedia.com/~css105-2c/midterm/midterm-1045445054/topp.html
心得:在index加上fadein了,但還想在加些什麼到網頁上

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445075
(2)製作心得:覺得滿簡單
1045445075



Edited 1 time(s). Last edit at 06/15/2017 11:48AM by 1045445075.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445147/
(2)製作心得:加上淡入效果更有感覺了。

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1015445216/
(2)製作心得:淡入很漂亮。順便發現之前期中忘記把圖檔放進去

作業網址:http://mepopedia.com/~css104-2c/midterm/midterm-1045445153/
心得:還蠻簡單的,開心



Edited 1 time(s). Last edit at 06/15/2017 12:18PM by 1045445153.
(編輯記錄)

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445006

(2)製作心得: 淡入的效果非常棒,因為這樣我又學到了一種效果,以後一定能用上的,謝謝老師教我們這樣淡入效果。

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1025445159
(2)製作心得: 只有首頁

(1)作業網址: http://mepopedia.com/~css105-2c/midterm/midterm-1045445144
(2)製作心得: 這個效果我覺得很好用,讓網頁能更豐富的感覺