數位文本的互動模態：基本七款

數位文本的互動模態：基本七款

互動，是有道理可以談的。

互動不是動來動去就爽了，不是，而是作者和讀者，藉由數位文本媒介而來的一種「對話方式」。你先寫了一些東西，然後想像讀者可能會不懂，可能會想問什麼。 然後，你設定了一個互動的機制。想像，讀者透過這個互動機制，數位文本可以回答讀者在心中想問的。

再來，互動既是一種對話式的文本展現形態，那麼互動式的文本意義呈現就有特色，即是一種「辯證性」的意義給出。文本的辯證方法，往往可以讓讀者理解更多， 更多於文本材料所提供的部分。

第一式：tooltips

方法一：滑鼠移到文字或圖片上，跑出說明文字

方法二：Hint.css 2.0：快速使用的純文字 tooltips

方法三：tooltipster 4.0版。超好用的tooltips模組。

第二式：click to hide / display

方法一：分層文本互動寫作技法(一)

方法二：按【文字】就會更新圖像或影音內容

方 法三：click即可【打開／隱藏】較長的內文

方 法四：排隊．請編輯元素一個接著一個出場

第三式：popup style 跳出式小視窗

方 法一：學生超愛用的影音跳出法：fancyBox

方 法二：移動滑鼠就跳出放大照片

方 法三：漂亮展出互動影音小視窗

方 法四：一進入文章就自動跳出影音

第四式：互動式清單列表 interactive list

方 法一：把紛雜的訊息收納起來, Accordion

方 法二：Tabs 式的文本互動形式

方 法三：清單式互動展開內容文本模組，按一下就有

方 法四：小資料量快速互動list：使用ol / li：easy jQuery

第五式：image hover

方 法一：圖文的互動：會滑動的互動圖說

方 法二：滑鼠移入，照片就會滑動

方 法三：快速好用的image hover；共24種：純CSS

方 法四：壓在圖上的文字，互動式

第六式：content slider

方 法一：有導覽小圖的image gallery: Fotorama

方 法二：正流行的Content slider，bxSlider

方 法三：超有氣質的圖文互動slider

方 法四：讓人癢眼的 jQuery Image Gallery，zAccordion

第七式：各種特色型互動模態

方 法一：互動的照片效果：時間前後的比較

方 法二：可以隨意拖拉的div，讓讀者更具主動性

方 法三：按一下讓圖片爆炸，換圖

方 法四：讓圖片有更豐富的想像力

Q & A：
本來可以正常的互動模式，在加入其他互動模組後，就動不了了？

影音回答：

說明：
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
上面這條程式碼的式子，要刪除，只保留第一個。