欲戴王冠必先承其重~*: 4月 2012

2012年4月27日星期五

在Web專案中加入自訂游標

想在自己建立的網站自訂游標，查了好久大部分網站提供的方式幾乎都為呼叫外部的URL來
載入所要使用的*.cur或*.ani檔，然後大多是對於自己部落格之類的教學。
而我試著將自己開發的專案加入自訂的游標，而非使用別人寫好的框架，當然不外乎一定要去修改css檔案，正常來說網路上大多提供了此兩個方式寫法舉例來說如下body{cursor:url(http://home.kimo.com.tw/seek2007tw/ani/12/055.ani)}
a:hover {cursor:url(http://home.kimo.com.tw/seek2007tw/ani/12/055.ani)}

http://home.kimo.com.tw/seek2007tw/ani/12事實上這一串是網路空間的url，用這種方式你還必須去申請一個網路空間或是自己花錢架Web Server，而我所在意的是由於我的開發環境並不能連結外部的URL，所以這方式對我而言是沒有用的，因為提供以下方式供大家參考。

首先開發一個Web Application會有WebContent的目錄，此時將你的*.ani或*.cur(游標檔案)放至

WebContent下，這個時候你就可以得到你所在的url，例如我的專案名稱為xxx而測試環境為127.0.0.1此時可以得到此URL為http://127.0.0.1/xxx/*.ani再將此URL放至你的CSS檔案中，如此一來你就可以得到專屬於你自己網路的游標圖示，而非呼叫外部的URL。

----------------------------------------------------------------------------------------------------------
延伸閱讀---由於先前測試時是使用IE6,IE8,IE9測試，利用上面方式已可正確執行，但這是利用直接修改CSS檔來定義自訂游標，由於我的專案擁有許多頁面，我只希望在部分頁面有這樣的效果，那麼只需在你的頁面原始碼<head></head>之間加入
body{
cursor:url("http://127.0.0.1/xxx/*.ani");
}
</style>
那麼你的效果就可以只在那個網頁產生，而其實更進一步其實由於我們是開發自己的Web Application所以其實我們的URL可以指定絕對路徑，意思就是目錄，
ex:cursor:url('/web/resource/images/*.ani');(建議新增一個目錄，注意加入'')
由於我開發的專案需要滿足客戶的需求是支援 IE及Chrome瀏覽器，但結果我使用上列語法執行時在Chrome並不會顯示出我想的效果，首先我試著查找是否是語法API問題，根據http://www.quirksmode.org/css/cursor.html這裡說明了關於cursor的 API用法以及所支援瀏覽器的版本，其中Chrome是使用Safiri核心，我先前文章有提過，找到url這段，看起來是支援的，而看到許多網路上的建議是使用cursor:url("http://127.0.0.1/xxx/*.ani"),pointer;這樣的寫法(default,pointer,...)看你想將你的自訂游標取代什麼游標，而我使用上列語法後在IE仍為正常，而Chrome卻出現了pointer的預設圖案(跟hand一樣)，我更加確定了Chrome確定有支援，但為何沒有跑出我的.ani檔呢!?沒錯，Chrome不支援使用*.ani檔案，但有支援.cur以及.png&.gif的檔案，所以首先你可以 download網路上有提供免費的.cur檔案，再將檔案放至於ani相同路徑的，但是.ani是一個動畫游標，如果我希望能在IE使用，可以使用下列語法

cursor: url('*.ani'), url('*.png'), default;

而事實上你還必須找到可將ani轉換成png的軟體，如此一來現在不管什麼瀏覽器都能使用了(除了Opera不支援url寫法)。

參考網站:
http://www.coursesweb.net/css/css-cursor-property-custom-cursors
http://www.w3schools.com/cssref/pr_class_cursor.asp

2012年4月25日星期三

使用properties檔將字串匯入class

在使用下列程式碼之前需將properties檔案放至與class相同目錄下(通常為/src)
正常而言，大多不需要再加入getConfig()此method，而直接使用props.getProperty("String");
但使用在需匯入大量程式碼時可減少程式碼，程式中註解部分為將檔案位置指派為絕對位置亦可獲得，但若是你的專案需要匯出至其它地方佈署(如webserver)，則new FileInputStream不建議使用，而改為使用getResourceAsStream()，且記得getClassLoader();
正常來說對於loadProperties() methed而言，不需要使用static，特別是你的專案需要匯出的時候，以節省記憶體。

private Properties props;

private void loadProperties() throws FileNotFoundException, IOException {
props = new Properties();
try{
InputStream inputStream = this.getClass().getClassLoader().getResourceAsStream("VaDAO.properties");
props.load(inputStream);
//props.load(new FileInputStream("C:/temp/datasource.properties"));

}catch (FileNotFoundException e) {
e.printStackTrace();
} catch (IOException e) {
e.printStackTrace();
}

}

private String getConfig(String key) {
return props.getProperty(key);
}

---------------------------------------------------------------------------------------
使用上面method來匯入我們的class檔
private void test(){

loadProperties();

String WLInitContextFactory = getConfig("weblogic.jndi.WLInitialContextFactory");
String provider_url = getConfig("PROVIDER_URL");
String ds_jndi_name = getConfig("VA_DS_JNDI_NAME");

System.out.print("WLInitContextFactory ---->"+ WLInitContextFactory );
System.out.print("provider_url -------->"+provider_url );
System.out.print("ds_jndi_name --------->"+ds_jndi_name );

}

我的properties檔名稱為VaDAO.properties
內容為
weblogic.jndi.WLInitialContextFactory=weblogic.jndi.WLInitialContextFactory
PROVIDER_URL=t3://192.168.11.24:8080
VA_DS_JNDI_NAME=DS_VA

若method正常執行則會秀出
WLInitContextFactory ---->weblogic.jndi.WLInitialContextFactory
provider_url -------->t3://192.168.11.24:8080
ds_jndi_name --------->DS_VA

2012年4月9日星期一

判斷不同瀏覽器並顯示出來

利用以下的語法就可以判斷是何者瀏覽器並在span中顯示出來
其後更可以利用此flag來改變css中的值來做不同瀏覽器有不同的css style

<span id="show" ></span>
<script type="text/javascript">
var isIE = navigator.userAgent.search("MSIE") > -1;
var isIE6 = navigator.userAgent.search("MSIE 6") > -1;
var isFirefox = navigator.userAgent.search("Firefox") > -1;
var isOpera = navigator.userAgent.search("Opera") > -1;
var isSafari = navigator.userAgent.search("Safari") > -1;//Google瀏覽器是用這核心
var browserType=null;
var chrome = "by_Chrome";
var IE9 = "by_IE9";
var IE6 = "by_IE6";
if (isIE) {
if (!!window["performance"]){
browserType = IE9;
//alert(browserType);
document.getElementById("show").innerHTML = browserType;
} else if(isIE6){
browserType = IE6;
document.getElementById("show").innerHTML = browserType;
}else
document.getElementById("show").innerHTML = "isIEOthers";
//alert('isIE_Others');
}
if (isFirefox) {
document.getElementById("show").innerHTML = "by_Firefox";
}
if (isOpera) {
document.getElementById("show").innerHTML = "by_Opera";
}
if (isSafari) {
browserType = chrome;
document.getElementById("show").innerHTML = browserType;
}
</script>

在Eclipse的properties檔註解使用中文

我從svn將整個專案load下來後發現我的properties註解部分有亂碼，
但svn上的原始檔案並不會，在直接更改亂碼部分為中文，更改完後要儲存時
發生Eclipse save problem，錯誤訊息為
save could not be completed.
Reason:
some characters cannot be mapped using "ISO-8859-1" character encoding.
Either change the encoding or remove the characters which are not supported
by the "ISO-8859-1" character encoding.

Please go to "Windows > Preferences > General > Content Types > Text > Java Properties Files or ...

> Default encoding > UTF-8 and click update button

之後就可以儲存成功了。

2012年4月27日 星期五