[相簿] Coppermine Photo Gallery Album Expander

appleboy — Tue, 01 Apr 2008 07:48:01 +0000

今天看到 gslin大神文章：PIXNET Album Expander，然後裝了一下，發覺非常好用，而我自己本身也有架設相簿，相簿程式是 open source Coppermine Photo Gallery，想說就自己練習看看，寫一個自己上傳相簿之後，可以快速瀏覽相簿，而這隻程式要先安裝好外掛 Greasemonkey，這隻外掛我之前有介紹過：firefox and IE 的 greasemonkey，大家可以看看，google 上面也有很多文章

script：Coppermine Photo Gallery Album Expander

測試相簿：我的相簿 Angel & Devil

原本的顯示如下：

裝完之後，顯示 normal 的圖形

這樣看起來非常方便，不用一直點連結，就可以看到該頁面所有圖片

我順便去測試了一下 segaa 大大的相簿系統：薰衣草之戀，測試結果如下

老大的相簿系統太 sex 了，哈哈

我在 script 裡面還有另外寫一個顯示方法，就是直接把圖片換成 normal 而已，沒有經過排列，顯示如下

轉錄 jQuery 的取值教學：jQuery Attributes 筆記

@addClass( class )

// 在  節點裡加入class = "selected"

// 移除 : removeClass( class ).

$("p").addClass("selected")

@attr( name ) 

// 取得 裡的src值

// before : 

// Result :  test.jpg

$("img").attr("src");

@attr( properties ) 

// 將  加入 src="test.jpg" alt="Test Image"

// before : 

// Result :  

$("img").attr({ src: "test.jpg", alt: "Test Image" });

@attr( key, value ) 

// 指定物件 的 key 並 設定 value

// 將  加入 src = "test.jpg"

// before : 

// Result :  

$("img").attr("src","test.jpg");

// 將  加入 value = "test.jpg"

// before : 

// Result : 

$("input").attr("value","test.jpg");

@attr( key, fn ) 

// 在裡加入 title 

//title 值 則是用function 回傳

//Before: 

//Result: 

$("img").attr("title", function() { return this.src });

//Before : 

//Result: 

$("img").attr("title", function(index) { return this.title + (++index); });

@html() 

// 取得 
 xxx 
 xxx <= 取得的東西

// Before :  xxx 

// Result : xxx 

$("div").html()

@html( val ) 

// 改變 xxx
 為 new stuff

// Before :  xxx 

// Result : new stuff

$("div").html("new stuff");

@removeAttr( name ) 

//移除

// Before : 

// Result : 

$("input").removeAttr("disabled")

@removeClass( class )

//移除  裡的 class

// Before : 
Hello

// Result : Hello

$("p").removeClass()

// Before : Hello

// Result : Hello

$("p").removeClass("selected")

// Before : Hello

// Result : Hello

$("p").removeClass("selected highlight")

@text() 

//取得   裡的字串

// Before : 
Test Paragraph.
Paraparagraph

// Result : Test Paragraph.Paraparagraph

$("p").text();

@text( val ) 

//取代內的字串

// Before : 
Test Paragraph.

// Result :  Some new text.

$("p").text("Some new text.");

// Before : Test Paragraph.

// Result :  Some new text.

$("p").text("Some new text.", true);

@toggleClass( class )

// 將有 class="selected" 移除 , 如果
沒有 class="selected" 則加入 

// Before :  
Hello
Hello Again

// Result : Hello
, Hello Again

$("p").toggleClass("selected")

@val()

// 抓取 INPUT 的 VALUE值

// Before :  

// Result :  "some text"

$("input").val();

@val( val ) 

// 將INPUT 的 VALUE 值 改變為指定

// Before :  

// Result :  

$("input").val("test");

Related View

[WWW] firefox and IE 的 greasemonkey

appleboy — Sat, 23 Feb 2008 08:30:43 +0000

最近發現這種新玩意，那就是猴子外掛 Greasemonkey，這一套我在 FireFox 有找到，用起來還不錯，可是一些 for ie 的網站，就使用不到了，所以我又另外去找了 Greasemonkey for ie 的版本，不過 for ie 的版本有兩套，一套是我想要，另一套我測試起來不是我想要的。

先介紹 for ie 的 Greasemonkey，總共有兩套

1.gm4ie
這一套了，其實相當不錯，不過有一個缺點，就是如果你的網站是用 iframe 做的化，他必需要重新 reload 整個網站，才會有作用，所以我並不打算用這套，不然他還是蠻方便的
2.Trixie
這個，就有符合到我的要求了，不過他在設定上面格式都要先寫好

// ==UserScript==

// @name          Server2

// @description   .

// @namespace     http://musicplayer.sourceforge.net/greasemonkey

// @include       http://xxxxxxxxx/index2/main_down.php*

// @include       http://xxxxxxxxx/index2/main_down.php*

所有套用的網站，都要寫在 // @include 這個裡面才會有作用，然後在用 ie alt+t +x 就可以更改 reload 設定了
3. Greasemonkey :: Firefox Add-ons
FireFox 的部份，這個外掛裝好，你在啟動他的時候，會要求你選擇編輯 js 的軟體，請務必選 notepad.exe ，不然你選擇其他程式，你就會編輯不到檔案，那他檔案的放置位置如下

C:\Documents and Settings\你的帳號\Application Data\Mozilla\Firefox\Profiles\qvq3wzwh.default\gm_scripts

小惡魔 - 電腦技術 - 生活日記 - 美食介紹 - AppleBOY » Greasemonkey

[相簿] Coppermine Photo Gallery Album Expander

Related View

[WWW] firefox and IE 的 greasemonkey

Related View