|
|
本書專心回答一個再基本的不過的問題:到底要教給同學什麼樣的數 位技 能?為什麼是選這個而不是選那個?而選上 了這個有什麼可被解釋的理由嗎?這理由與「新聞敘事」有什麼關系?這些數位技能要如何使用?怎麼用得好! |
|
click
to 全文閱讀
|
1.
請將下列程式碼複製並置於<head>xxx</head>之間或<body>之後: |
<script
src="http://code.jquery.com/jquery-1.9.1.js"></script> <script type="text/javascript" src="http://lmcdwriting.org/userfiles/lmcsilver20121007/fancyapps-fancyBox-0ffc358/source/jquery.fancybox.js"></script> <link rel="stylesheet" type="text/css" href="http://lmcdwriting.org/userfiles/lmcsilver20121007/fancyapps-fancyBox-0ffc358/source/jquery.fancybox.css" media="screen"></link> |
說明: 上我課的同學,建議放在<body>之後。 |
2.
請將下列驅動程式碼複製並置於<body>之後: |
<script> $(function () { $("#lmca02").click( function () { $.fancybox({ autoSize: false, width: 540, autoHeight: true, href: '#02140923w', title: '閱讀全文', type: 'inline', padding: 5, openEffect: 'elastic', preload: true }); }); }); </script> |
說明: 藍色字和綠色字的部分,是要配合第 3 、第 4 部分所設的 id 之內容。 |
3.
在所欲的編輯區域,置入下列可以click文字的語法: |
<span
style="text-decoration: underline; cursor: pointer;"
id="lmca02">click
to 全文閱讀</span> |
說明: span內要設id="xxx",此例 lmca02 (藍色字)。這一代碼是要寫入到第 2 部分的 $("#xxx"),此例為 $("#lmca02")。要記得加上 # 。 |
4.
在編輯區域之末,置入要全文跳出的內文: |
<div
id="02140923w"
style="padding: 10px; font-family: 微軟正黑體; font-size:
1.24em; line-height: 180%; letter-spacing: 0.1em; display: none;"> 請置入內文;也可以圖文形式的文本;可放入任何HTML文本。<br> </div> |
說明: div內要記得設上id="xxx",此例為 02140923w (綠色字部分),這一代碼是要寫入到第 2 部分的 href="#xxx",此例為 href: '#02140923w'。要記得加上 # 。 |
注意:
上面的動作只能做出「一個」互動效果,如要做出第二個,請重覆2-4的項,並更換不同的 id ,即上述的藍、緣字部分。
沒有留言:
張貼留言