沒穿方服

索引

顯示╱隱藏內文
顯示具有 jQuery 標籤的文章。 顯示所有文章
顯示具有 jQuery 標籤的文章。 顯示所有文章
預設的按鈕外觀

小小東西放上 Google Code 有點抱歉。

試想一個 overflow-x 且高度很大的 box,想水平捲動,捲軸卻在畫面外(下方),怎麼辦?

hScrollBtns 在元素左右加上按鈕,用來操作水平捲動。這方法應該比 自動捲動 或 設法移動捲軸 容易接受。

詳細請至專案首頁 (Google Code) 參考,可支援 ie 6 不過 CSS 要改改。


Demo

$('#hScrollBtnsDemoBox').hScrollBtns({step:4, speed:6, safeHeight:300});

hScrollBtns Demo box:

box height:


醒獅睏寶圖(風獅爺睡覺)

醒獅睏寶圖(風獅爺睡覺)

(小時候畫的圖,放棄所有權利)

類似功能的 plugin,也許這才是你要的: HoverScroll jQuery PluginjQuery Smooth Div Scroll by Thomas Kahn

簡單的音效功能,應該沒人想自己寫吧。
先看幾個現存可用的:

  • Audio Engine

    就是 Scriptaculous 的 sound.js,單純地產生 <embed> 來發聲,在 ie 使用 bgsound,其他瀏覽器則仰賴 QuickTime 支援。可做 track 控制及全域 enable/disable 的切換;再移植版 jQuery 的 jquery.sound.js 還可設定 timeout 將產生的 <embed> 移除。

    $.sound.play( '/path/to/some.wav' , {track: "track1";} );
  • JSSoundKit (Javascript Sound Kit)

    透過 ActionScript 的 ExternalInterface,寫出一個 proxyMethods 方法來操作 Flash Sound 物件。功能自然也跟 ActionScript 2.0 的 Sound 類別一樣。

    var mysound = new Sound();
    mysound.loadSound('/path/to/some.wav' , true);
  • SoundManager2

    同樣依靠 flash,但它是再設計封裝過的、更完整的 API,也比 JSSoundKit 穩定可靠。壓縮後約 18 kb 說龐大難養也不至於。

    soundManager.play('mySound','/path/to/some.mp3');


※以上僅介紹我試用過的,當然有其他選擇,例如 MooTools 用的 mooSound


最後我懶得探索,於是自己寫了 jQuery plugin:flashSound,測試一下還算堪用,不過它只有最基本的功能(包括停用音效),可以發出登登登的聲音,但是要做歌曲播放器的話,很勉強喔。

詳細使用方面,接受兩種風格的寫法,其之一:

$.flashSound( 'foo.mp3', {id: 'se1'} );     // 讀取聲音檔(還不會播放),並將物件命名為 se1
$.flashSound.play('se1');                   // 播放
$.flashSound.play('se1', true);             // 播放,但先停止前一個播放的聲音
$.flashSound.stop('se1');                   // 停止播放
$.flashSound.remove('se1');                 // 移除 flash 物件

或者

var se1 = $.flashSound( 'foo.mp3' );   // 讀取聲音檔
se1.play();                            // 播放
se1.play(true);                        // 播放,但先停止前一個播放的聲音
se1.stop();                            // 停止播放
se1.remove();                          // 移除 flash 物件
// 請留意若在 se1 建立前呼叫 play, stop,會發生「物件沒有該方法」的錯誤。

另外全域啟用╱停用音效的方法是:

$.flashSound.enable();        // 全面啟用 flashSound
$.flashSound.disable();       // 全面停用 flashSound


下載、測試請至 flashSound 首頁參觀。

我寫了一個名字很奇怪的 jQuery plugin,用途跟所謂的 JavaScript Typewriter(打字機效果)相似,就是把頁面內容逐字顯示出來。

這類效果曾經被大量濫用,所以現在很容易帶給用戶落伍的瀏覽體驗。至於我則是把目標放在 Web Game 或類似的網頁,做對話框的顯示之類的。

可以做這樣的事喔(只是擷圖)

理想狀況是用 HTML 寫好對話內容,然後套用 msgPlay(options) 就能得到包括斷句、分頁控制(也是先由 HTML 內容指定好)的效果。

具體檔案在 Google Code 下面的 msgplay,另外說明文件和範例在 msgPlay 首頁msgPlay Demo Page

目前最大問題是在 Opera 上播到元素節點之後就不會「逐字」顯示了,我還找不出原因Opera 9.5 已無此狀況)。還有就是 msgPlay 這個有點不知所謂的命名…… 我還真不知道該改成什麼。