CSS 動畫

最近因為project的關係，需要用到動畫，最近CSS動畫又很紅!!

就來找了幾個資料來看看，發現用CSS支援很多


以下是參考的網站，可以看看都寫的還錯(希望我沒看錯,如果有更好的可以留言推薦一下)

Animation
CSS 动画指南： 原理和实战 （一）
CSS 动画指南： 原理和实战（二）

CSS3與濾境(12)－影格動畫

CSS Animation Tutorial

[CSS3 Note.] CSS3 Transform Matrix 筆記


Transform
CSS transform 能旋轉、傾斜、縮放變形 box

JavaScript 判斷是什麼瀏覽器

Android

var isAndroid = navigator.userAgent.toLowerCase().match(/android/i);

iPad

var isiPad = navigator.userAgent.match(/iPad/i)

iPhone

var isiPhone = navigator.userAgent.match(/iPhone/i)

iPod

var isiPod = navigator.userAgent.match(/iPod/i)

參考網站：http://hsinyu00.wordpress.com/2011/04/05/mobile-web-user-agent-sniffing/

修改blogger版面寬度

在Blogger後台，範本修改

就不囉唆直接參考

http://etblue.blogspot.com/2010/12/blogger-flexible-width-changes-with.html

當Android螢幕轉向的問題

當Android螢幕轉向時(如下)

setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE);

系統都會將當前的Activity關閉並重新開啟。

為了不要讓他重新執行一次，要對AndroidManifest.xml文件做一些修改

AndroidManifest.xml文件

<activity android:name=".Magazine"> 
</activity> 
//修改為：
<activity android:name=".Magazine"   android:configChanges="orientation|keyboard"> </activity>

說明：android:name=".Magazine"  為當前要修改的activty。這樣是讓程序能夠響應旋轉屏幕的事件。


然後重寫onConfigurationChanged方法：

@Override
public void onConfigurationChanged(Configuration newConfig) {
    super.onConfigurationChanged(newConfig);
    if(D) Log.d(TAG, "+++ onConfigurationChanged +++");
}

這樣系統就不會關閉重新開啟。

參考網站：
http://www.aslibra.com/blog/post/android-onConfigurationChanged.php
http://tonycube.blogspot.com/2011/10/dont-reload-when-rotate-device.html

Android 畫面方向

Android 畫面方向

//螢幕未指定
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_UNSPECIFIED);

//螢幕橫向
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_LANDSCAPE); 

//螢幕直向   
setRequestedOrientation(ActivityInfo.SCREEN_ORIENTATION_PORTRAIT);

Android 3.0 解決 android.os.NetworkOnMainThreadException

Android 3.0 解決 android.os.NetworkOnMainThreadException 這問題,
似乎是在3.0在網路上做了更嚴格的限制

在 onCreate()裡面加入

StrictMode.setThreadPolicy(new StrictMode.ThreadPolicy.Builder()     
        .detectDiskReads()     
        .detectDiskWrites()     
        .detectNetwork()   // or .detectAll() for all detectable problems     
        .penaltyLog()     
        .build());     
StrictMode.setVmPolicy(new StrictMode.VmPolicy.Builder()     
        .detectLeakedSqlLiteObjects()     
        .detectLeakedClosableObjects()     
        .penaltyLog()     
        .penaltyDeath()     
        .build());

參考網站：http://liangfangli86.blog.163.com/blog/static/96848631201172314036329/

在 FreeBSD上的Apache,PHP的一些小設定

目前這個設定是針對我們Lab，大概就openssl不一樣

php.ini

-------------------------------------------------

error_reporting = E_ALL & ~E_NOTICE

extension=php_openssl.dll   

date.timezone = "Asia/Taipei"

short_open_tag = On

httpd.conf

-------------------------------------------------

AllowOverride All 

解釋

php.ini

-------------------------------------------------

error_reporting = E_ALL & ~E_NOTICE    #是要讓PHP對變數不要太嚴警

extension=php_openssl.dll   #因為Gmail的關係所以會要拿掉

date.timezone = "Asia/Taipei"  #設定時區

short_open_tag = On   #開啟短標籤  <?   ?> 

httpd.conf

------------------------------------------------

AllowOverride All  #讓.htaccess可以執行

[PHP] 將Mysql 的時間轉換到PHP 並轉換格式

這裡就不講怎麼從 Mysql 抓值

<?php 
    echo date("l, M d, Y",  strtotime($row['date']));
    echo date("h:i A",  strtotime($row['date'])); 
?>

mysql date : 2011-08-06 03:53:32
php echo : Saturday, Aug 06, 2011 03:53 AM

[PHP] 上傳圖片

 最近用php寫一個上傳圖片的程式

HTML

<form name="form1" action="" method="post" enctype="multipart/form-data">
    <label><input name="file" type="file"></label>
</form>

PHP

$file_name= $_FILES['file']['name']; //檔案名字
$file_temp_name = $_FILES['file']['tmp_name']; //伺服器上暫存檔名
$DestDIR = '............./'.$file_name;
move_uploaded_file($file_temp_name, $DestDIR); //將上傳的檔案儲存到指定的目錄

這樣就完成了!!

其中可以用 is_uploaded_file(file) 這個函數去判斷是否有上傳檔案
函數連結：http://php.net/manual/en/function.is-uploaded-file.php

參考網站：http://ckone1209.com/blog/?p=306
                http://blog.yam.com/eviles/article/10921956

[jQuery]Nivo Slider

Nivo Slider

這個是一個相當有質感的Slider，不僅滑動的圖片特效很多，還不固定

讓人有一種期待的心，想接著再看下一張

Dome：http://nivo.dev7studios.com/demos/
Downloads：http://dev7studios.com/downloads/42

[jQuery] jQuery progressbar

 jQuery progressbar

這是一個還蠻漂亮的 Progressbar

推薦大家

Dome：http://t.wits.sg/misc/jQueryProgressBar/demo.php

Downloads：http://t.wits.sg/jquery-progress-bar/

讓你的網頁擁有像Blog的文章編輯器

CKEditor 

這個網站提供很方便編輯器，他所提供的功能不僅有一般文字修改(粗體、斜體)

還包含超連結、圖片、縮行、以及表格等等的

功能十分強大，即使你的網站色系是暗色他也能做調整，是個還不錯的套件


Dome：http://ckeditor.com/demo
Downloads ：http://ckeditor.com/download

在GAE使用Distinct(配合template)

前幾天在使用資料庫的時候發現了一個方法,通常在讀取資料庫的時候沒辦法使用MySQL、MS SQL裡的 Distinct，在抓重複的值的時候會多抓但又沒辦法只抓單筆

於是我也不知道去哪裡想出來的方法，配合template語法，在for裡加入ifchanged就可以有Distinct效果

{% for i in billdb %}
    {% ifchanged %}
        <option value="{{i.bill_idnum}}">{{i.bill_idnum}}</option>
    {% endifchanged %}
{% endfor %}

[Android] layout_gravity 和 gravity 的區別

layout_gravity 和 gravity 主要的區別是在於layout_gravity是針對父元素，也就是在他之前的元素做調整；而 gravity 是指他裡面去做調整。


android:layout_gravity="left"

android:layout_gravity="center"

android:gravity="right"

各屬性詳細的說明可以看 Drawable Resources

-
以上圖片連結參考 kuluto 的 此篇文章 若原創者有任何問題，可以寄信通知。

[JavaScript] 開啟視窗

HTML

<a href="#" onclick="window.open('test.html','textfile',config='height=500,width=750,menubar=1')">
   詳細資料
</a>

可以直接開啟新視窗，並且再最可以隱藏工具列等其他的設定

下面是jQuery 寫法

HTML

<a href="#" id="userdata" >詳細資料</a>

jQuery

$("#userdata").click(function () { 
    window.open('/','textfile',config='height=500,width=750,menubar=1');
});

以下是參數

height=100 窗口高度；

width=400 窗口寬度；

top=0 窗口距離瀏覽器上方的像素值；

left=0 窗口距離瀏覽器左側的像素值；

toolbar=no 是否顯示工具列，yes為顯示、no為不顯示；

menubar=no 是否顯示選單列，yes為顯示、no為不顯示；

scrollbars=no 是否顯示滑動軸，yes為顯示、no為不顯示；

resizable=no 是否允許改變窗口大小，yes為允許、no為不允許；

location=no 是否允許顯示網址列，yes為允許、no為不允許；

status=no 是否顯示狀態檔內的訊息，yes為允許、no為不允許；



參考網站：http://www.study-area.org/coobila/tutorial_275.html
                http://www.javascript-coder.com/window-popup/javascript-window-open.phtml
                http://kyo0183.blogspot.com/2008/10/windowopen.html

[jQuery] 指定select為選取狀態

範例 HTML

<select id="selectBox">
    <option value="A">Number 0</option>
    <option value="B">Number 1</option>
    <option value="C">Number 2</option>
    <option value="D">Number 3</option>
    <option value="E">Number 4</option>
    <option value="F">Number 5</option>
    <option value="G">Number 6</option>
    <option value="H">Number 7</option>
</script>

jQuery code

<script>
   $('#selectBox option[value=C]').attr('selected', 'selected');
</script>

在網頁裡就會顯示"Number 2"




取得目前點選的val值

<script>
$("#selectBox").change(function(){
    var t = $(this).val(); 
})
</script>

參考網頁 here

[GAE] reCaptcha 應用Python

首先先在 recaptcha 這裡申請網站 Domain Name


之後會給你 Public Key 跟 Private Key 等等會用到


接著在裡選擇語言 here 這裡介紹Python


先從 這裡下載python用的 python_recaptcha-client 下載解壓縮後將 \recaptcha\client\captcha.py 放在你的gae目錄底下

接著在你的檔案 import captcha
呼叫此函數captcha.displayhtml('public_key') 在public_key 裡放入剛剛取得的 Public Key，會回傳一段reCaptcha 的 html


前端的部份就完成，然後在你的post那裡取得你的 recaptcha_challenge_field 、recaptcha_response_field和設定你的private_key跟你的Domain Name

recaptcha_challenge_field = self.request.get('recaptcha_challenge_field')

recaptcha_response_field = self.request.get('recaptcha_response_field')

private_key = 'private_key'   #剛剛取得的private_key
remoteip= 'domain_name '  #剛剛申請的domain_name 

呼叫 captcha.submit(recaptcha_challenge_field,recaptcha_response_field,private_key,remoteip)

會回傳你剛剛在reCaptcha t輸入的是否為正確(return boolean) 就完成啦!!

全部語法

import captcha
from google.appengine.ext import webapp

# Captcha   
domain_name = 'you_domain_name'
public_key = 'public_key'
private_key = 'private_key'

class test(webapp.RequestHandler):
    def get(self):
        captcha_html = captcha.displayhtml(public_key)
        self.response.out.write(captcha_html)
        
    def post(self):
        recaptcha_challenge_field = self.request.get('recaptcha_challenge_field')
        recaptcha_response_field = self.request.get('recaptcha_response_field')
        private_key = private_key
        remoteip = domain_name
    
        ans = captcha.submit(recaptcha_challenge_field,recaptcha_response_field,private_key,remoteip)
        
        self.response.out.write('ans= '+str(ans.is_valid))

有問題可以參考這篇 reCaptcha_to_php 應該大同小異，或是
直接參考 google recaptcha api

Android MenuInflater的使用(layout menu)

1.建立一個 Android 工程我們命名為 MenuInflaterDemo .

2.在 res 目錄下創建 menu 目錄，並且創建 options_menu.xml (我們定義的菜單)文件,代碼如下:

<?xml version= "1.0"  encoding= "utf-8" ?>  
<menu  
  xmlns:android= "http://schemas.android.com/apk/res/android" >  
    <item android:id= "@+id/menu_add"  
          android:title= "Add"  
          android:icon= "@android:drawable/ic_menu_add"  
           />  
    <item android:id= "@+id/menu_wallaper"  
          android:title= "Wallpaper"  
          android:icon= "@android:drawable/ic_menu_gallery"  
           />  
   <item android:id= "@+id/menu_search"  
          android:title= "Search"  
          android:icon= "@android:drawable/ic_search_category_default"  
           />  
   <item android:id= "@+id/menu_setting"  
          android:title= "Settings"  
          android:icon= "@android:drawable/ic_menu_preferences"  
           />  
</menu>

3.在主要程式碼內加入，如下

@Override  
    public boolean onCreateOptionsMenu(Menu menu) {  
        MenuInflater inflater = getMenuInflater();  
        inflater.inflate(R.menu.options_menu, menu);      
        return true;  
    }  
      
    @Override  
    public boolean onOptionsItemSelected(MenuItem item) {  
        switch  (item.getItemId()) {  
        case  R.id.menu_add:  
            break ; 
        case  R.id.menu_wallaper:  
            break ;  
        case  R.id.menu_search:  
            break ;  
        case  R.id.menu_setting:    
            break ;  
        }  
        return  super .onOptionsItemSelected(item);  
    }

當選單選到Add or Wallpaper ...則會執行 onOptionsItemSelected 底下 
switch 的case




參考網站：http://blog.csdn.net/Android_Tutor/archive/2010/04/23/5522913.aspx

GAE 使用Session

網址：gae-sessions

下載完後，將gaesessions資料夾放入子目錄

在修改 appengine_config.py 裡的 9行

COOKIE_KEY = 'do not use this key'

更改成

COOKIE_KEY = os.urandom(64)

使用方法和一些函數使用

session = get_current_session()  

session['a'] ='a'  

session.has_key('a')

session.terminate()

session = get_current_session()  

建立 session

session['a'] ='a' 

設立一個為a的session值為'a'

session.has_key('a')

判斷是否有a這個session return bool

session.terminate()

刪除session並終止該用戶


詳細函數可以至gaesessions目錄下的__init__.py

Androd 播放音樂

private MediaPlayer mPlayer;

mPlayer = new MediaPlayer();
mPlayer = MediaPlayer.create(BluetoothControl.this, R.raw.sound_file_1);
mPlayer.start();

在 Android 中，要播放影音檔，新版的 SDK 會建議你用 MediaPlayer 這個類別。裡頭提到，有兩個方法。一個是播放存放在 res/raw 中的影音檔，用下面這種方式。

MediaPlayer.create(BluetoothControl.this, R.raw.sound_file_1);

MediaPlayer.create(context, R.raw.檔名);

參考連結：
http://ysl-paradise.blogspot.com/2008/08/mediaplayercreate.html
http://toimy.blogspot.com/2009/10/android-mediaplayer.html

Eclipse Android SDK的emulator: ERROR: unknown virtual device name

如果遇到這個狀況


emulator: ERROR: unknown virtual device name 'XXX'
emulator: could not find virtual device name 'XXX'


解決方法


1.電腦(我的電腦) 右鍵 -> 內容  -> 進階系統設定 -> 環境變數

2.系統變數->新增
變數名稱：ANDROID_SDK_HOME (固定)
變數值：E:\android-sdk-windows (為你的android-sdk存放路徑)

3.重啟 Eclipse 執行即可。




註:這個方法可以直接在SDK路徑下建立AVD ，若不想直接在SDK下建立也是有其他方法，可以另行參拜Google大神

[FreeBSD] VMware Tools Install (8.1)

在安裝VMware Tools 之前要先安裝 perl5.10  跟 compat 6x

#cd /usr/port/lang/perl5.10 ; make install clean
#cd /usr/ports/misc/compat6x ; make install clean

然後在掛載VMware Tools
【VM \ Guest \ Install/Upgrade VMware Tools】

#mount /cdrom
#cd /cdrom
#cp vmware-freebsd-tools.tar.gz /tmp
#cd /tmp ; umount /cdrom
#tar zxvf vmware-freebsd-tools.tar.gz
#cd vmware-tools-distrib/
#./vmware-install.pl