麻豆一区二区99久久久久,日韩av有码,亚洲日本欧美天堂

【轉】設計師有用的顏色組合應用程序

在設計產品時，要考慮到到很多的因素，其中一個重要的是配色方案。不同的顏色可以使您的產品創造出不同的效果。請務必檢查顏色在一般和特定的文化含義，以獲得最佳使用效果。

在這篇文章中，我想向大家介紹一些有用的設計工具將幫助您選擇合適的調色板為您的設計。這里有15個在線工具分析和收集的色彩組合。

Colrd

轉自：http://www.cnblogs.com/58top/archive/2013/01/15/useful-color-combination-apps-for-designers.html

posted @ 2013-03-20 22:04 小胡子閱讀(216) | 評論 (0) | 編輯收藏

【轉】分享20個有用的免費的jQuery工具提示插件

當你將鼠標懸停在該元素，可以顯示元素有關的信息。當你想顯示的額外信息，工具提示是最好的，無需改變你的設計元素。當你把鼠標光標移到元素，比如鏈接或按鈕，出現一個小框，額外的顯示有關該元素的信息。工具提示可以更加用戶友好的

大多數的網站管理員使用這些工具提示顯示他們的Facebook和Twitter的追隨者，同樣地，你可以利用這些工具提示自己的網站信息。

今天，我已經收集了20個最好的，免費供您使用jQuery的工具提示插件。

jQuery Tooltip Plugins

轉：

http://www.cnblogs.com/58top/archive/2013/01/11/free-jquery-tooltip-plugins.html

posted @ 2013-03-20 22:00 小胡子閱讀(313) | 評論 (0) | 編輯收藏

textarea元素已被廣泛用于網頁Web的IDE。通常網站自帶的textarea編輯器不能滿足我們的需求，作為一名開發者我們經常需要進行代碼的在線編輯，高亮顯示代碼等，因此，通過其他的開源項目，我們可以添加一些實用的功能，在這篇文章中，我將使用JavaScript庫ACE來創建一個輸入框效果。這是一個完全開源的腳本。該腳本允許開發人員創建支持語法高亮的輸入框。然后你可以代碼嵌入到網站中的任何地方

下載庫首先我們需要Github上下載ACE代碼。下載完成后解壓縮，在你的header部分引入js文件

添加代碼到編輯器

首先設置一個id為editor的div 然后在script里面調用ace.edit()方法，代碼如下

var editor = ace.edit("editor");
editor.getSession().setMode("ace/mode/javascript");

您可以重命名變量，為了方便起見，我定義了var editor作為變量，你也可以定義var demoeditor作為變量。第二行聲明使用哪種類型的語言高亮顯示。您可以從 src 目錄選擇其他語言集合。這里是一些支持支持的語言集合：

SQL
Ruby
SASS
PHP
Objectivec
Csharp
Java
JSON

使用額外的參數

editor.setTheme("ace/theme/dawn");
editor.getSession().setTabSize(2);
editor.getSession().setUseWrapMode(true);

這3行代碼是關于文本輸入效果的，第一行改變代碼默認的語法顏色和主題，在src目錄下個有幾十個新的主題，你可以從中任意選擇

另外兩個選項是關于用戶體驗。通常情況下，按一個鍵盤上的Tab鍵將輸入4個空格，這里我設置成2個空格，此外，該文本在默認情況下將不會自動換行，超了會追加一個水平滾動條向外延伸。但使用這種方法setUseWrapMode（true），我們可以修復自動換行的問題。

還有一些其他的命令，你可以參考ACE向導。這里面包含了改變光標的位置，動態添加新內容，或復制的文本的全部內容。

CSS代碼

#editor {    
 margin-left: 15px;   
 margin-top: 15px;   
 width: 1000px;   
 height: 400px; }

原文出自：

http://www.cnblogs.com/58top/archive/2013/01/28/building-a-syntax-highlighted-input-box-with-javascript.html

posted @ 2013-03-20 21:35 小胡子閱讀(341) | 評論 (0) | 編輯收藏

【轉】理解AOP

Aspect Oriented Programming 面向切面編程。解耦是程序員編碼開發過程中一直追求的。AOP也是為了解耦所誕生。

具體思想是：定義一個切面，在切面的縱向定義處理方法，處理完成之后，回到橫向業務流。

AOP 在Spring框架中被作為核心組成部分之一，的確Spring將AOP發揮到很強大的功能。最常見的就是事務控制。工作之余，對于使用的工具，不免需要了解其所以然。學習了一下，寫了些程序幫助理解。

AOP 主要是利用代理模式的技術來實現的。

1、靜態代理：就是設計模式中的proxy模式

a、業務接口

/**
* 抽象主題角色：聲明了真實主題和代理主題的共同接口。
*
* @author yanbin
*
*/
public interface ITalk {

public void talk(String msg);

}

b、業務實現

/**
* 真實主題角色：定義真實的對象。
*
* @author yanbin
*
*/
public class PeopleTalk implements ITalk {

    public String username;
    public String age;

    public PeopleTalk(String username, String age) {
        this.username = username;
        this.age = age;
    }

    public void talk(String msg) {
        System.out.println(msg + "!你好,我是" + username + "，我年齡是" + age);
    }

    public String getName() {
        return username;
    }

    public void setName(String name) {
        this.username = name;
    }

    public String getAge() {
        return age;
    }

    public void setAge(String age) {
        this.age = age;
    }

}

c、代理對象

/**
* 代理主題角色：內部包含對真實主題的引用，并且提供和真實主題角色相同的接口。
*
* @author yanbin
*
*/
public class TalkProxy implements ITalk {

    private ITalk talker;

    public TalkProxy(ITalk talker) {
        // super();
        this.talker = talker;
    }

    public void talk(String msg) {
        talker.talk(msg);
    }

    public void talk(String msg, String singname) {
        talker.talk(msg);
        sing(singname);
    }

    private void sing(String singname) {
        System.out.println("唱歌：" + singname);
    }

}

d、測試類

/**
* 代理測試類，使用代理
*
* @author yanbin
*
*/
public class ProxyPattern {

    public static void main(String[] args) {
        // 不需要執行額外方法的。
        ITalk people = new PeopleTalk("AOP", "18");
        people.talk("No ProXY Test");
        System.out.println("-----------------------------");

        // 需要執行額外方法的（切面）
        TalkProxy talker = new TalkProxy(people);
        talker.talk("ProXY Test", "代理");
    }

}

從這段代碼可以看出來，代理模式其實就是AOP的雛形。上端代碼中talk(String msg, String singname)是一個切面。在代理類中的sing(singname)方法是個后置處理方法。

這樣就實現了，其他的輔助方法和業務方法的解耦。業務不需要專門去調用，而是走到talk方法，順理成章的調用sing方法

再從這段代碼看：1、要實現代理方式，必須要定義接口。2、每個業務類，需要一個代理類。

2、動態代理：jdk1.5中提供，利用反射。實現InvocationHandler接口。

業務接口還是必須得，業務接口，業務類同上。

a、代理類：

/**
* 動態代理類
*
* @author yanbin
*
*/
public class DynamicProxy implements InvocationHandler {

    /** 需要代理的目標類 */
    private Object target;

    /**
     * 寫法固定，aop專用:綁定委托對象并返回一個代理類
     *
     * @param delegate
     * @return
     */
    public Object bind(Object target) {
        this.target = target;
        return Proxy.newProxyInstance(target.getClass().getClassLoader(), target.getClass().getInterfaces(), this);
    }

    /**
     * @param Object
     *            target：指被代理的對象。
     * @param Method
     *            method：要調用的方法
     * @param Object
     *            [] args：方法調用時所需要的參數
     */
    @Override
    public Object invoke(Object proxy, Method method, Object[] args) throws Throwable {
        Object result = null;
        // 切面之前執行
        System.out.println("切面之前執行");
        // 執行業務
        result = method.invoke(target, args);
        // 切面之后執行
        System.out.println("切面之后執行");
        return result;
    }

}

b、測試類

/**
* 測試類
*
* @author yanbin
*
*/
public class Test {

    public static void main(String[] args) {
        // 綁定代理，這種方式會在所有的方法都加上切面方法
        ITalk iTalk = (ITalk) new DynamicProxy().bind(new PeopleTalk());
        iTalk.talk("業務說明");
    }
}

輸出結果會是：

切面之前執行
people talk業務說法
切面之后執行

說明只要在業務調用方法切面之前，是可以動態的加入需要處理的方法。

從代碼來看，如果再建立一個業務模塊，也只需要一個代理類。ITalk iTalk = (ITalk) new DynamicProxy().bind(new PeopleTalk()); 將業務接口和業務類綁定到動態代理類。

但是這種方式：還是需要定義接口。

3、利用cglib

CGLIB是針對類來實現代理的，他的原理是對指定的目標類生成一個子類，并覆蓋其中方法實現增強。采用的是繼承的方式。不細說，看使用

a、業務類

/**
* 業務類
*
* @author yanbin
*
*/
public class PeopleTalk {

    public void talk(String msg) {
        System.out.println("people talk" + msg);
    }

}

b、cglib代理類

/**
* 使用cglib動態代理
*
* @author yanbin
*
*/
public class CglibProxy implements MethodInterceptor {

    private Object target;

    /**
     * 創建代理對象
     *
     * @param target
     * @return
     */
    public Object getInstance(Object target) {
        this.target = target;
        Enhancer enhancer = new Enhancer();
        enhancer.setSuperclass(this.target.getClass());
        // 回調方法
        enhancer.setCallback(this);
        // 創建代理對象
        return enhancer.create();
    }

    @Override
    public Object intercept(Object proxy, Method method, Object[] args, MethodProxy methodProxy) throws Throwable {
        Object result = null;
        System.out.println("事物開始");
        result = methodProxy.invokeSuper(proxy, args);
        System.out.println("事物結束");
        return result;
    }

}

c.測試類

/**
* 測試類
*
* @author yanbin
*
*/
public class Test {

    public static void main(String[] args) {
        PeopleTalk peopleTalk = (PeopleTalk) new CglibProxy().getInstance(new PeopleTalk());
        peopleTalk.talk("業務方法");
        peopleTalk.spreak("業務方法");
    }

}

最后輸出結果：

事物開始
people talk業務方法
事物結束
事物開始
spreak chinese業務方法
事物結束

由于篇幅有限，這篇主要對AOP的原理簡單實現做了演示和闡述，有助自己理解。至于Spring的AOP實現上面無外乎其右，不過實現方面復雜的多。

原文出自：

http://www.cnblogs.com/yanbincn/archive/2012/06/01/2530377.html

posted @ 2013-03-02 22:28 小胡子閱讀(315) | 評論 (0) | 編輯收藏

【轉】ExtJS練習——ComboBox的四種擴展

摘要: 摘要：ComboBox是常用控件之一，但由于其數據來源分兩種形式：本地和遠程，故寫的形式難度并不亞于ExtJS中的TreePanel和 GridPanel。鄙人也經常提醒自己的師弟師妹，ExtJS本身是面向對象寫的，不能在應用的時候卻不按照面向對象來寫，面向對象最起碼的好處就是代碼的復用，對于網頁來講，代碼復用的好處就是加載的JS會少很多，這樣網頁渲染時就不會很慢。下面我將分別介紹擴展的四種Co... 閱讀全文

posted @ 2013-03-02 21:48 小胡子閱讀(5100) | 評論 (0) | 編輯收藏

【轉】Ext Combox 分頁

首先定義一數據源，一般使用simpleStore，jsonStore。需要注意的是simpleStore用于讀取二維數組的數據，而jsonStroe用于讀取json數據格式。
Combox使用simpleStore 代碼如下所示：

var subjectField = new Ext.form.ComboBox({
     fieldLabel : '分類名稱',
hiddenName : 'drug.subjectCode',// 傳遞到后臺的參數
store : new Ext.data.SimpleStore({
autoLoad : true,
url :'xxx',
fields : ['subjectCode', 'subjectName']
}),
   valueField : 'subjectCode',// 域的值,對應于store里的fields
   displayField : 'subjectName',// 顯示的域,對應于store里的fields
   typeAhead : true,// 設置true，完成自動提示
   mode : 'local', // 設置local，combox將從本地加載數據
   triggerAction : 'all',// 觸發此表單域時,查詢所有
   selectOnFocus : true,
   anchor : '90%',
   forceSelection : true
   });

服務端返回的數據結構如下所示：
[
["00000003","硬膏劑"],
["00000005","滴眼劑"],
["00000016","栓劑"],
["00000017","注射劑"],
["00000018","軟膏劑"]
]

當combox使用jsonStore時，一般運用于分頁查詢。頁面效果如下所示：

示例代碼如下所示：
// 藥品商品名

var itemNameField = new Ext.form.ComboBox({
    width : 200,
    fieldLabel : '藥品商品名',
    hiddenName : 'drug.itemName',
    store : advanceStore,
    valueField : 'itemName',
    displayField : 'itemName',
    typeAhead : true,
    mode : 'remote',// 分頁查詢必須設置為    remote,當我們點擊下一頁的時候是從服務端取數據，而不是本地
    triggerAction : 'all',
    emptyText : '請選擇一個分類名',
    selectOnFocus : true,
    minChars : 0, // 完成自動提示,當mode為‘local’時,默認為0,當mode為‘remote’時候,默認為4,這里設置為0
    pageSize : 10,// 每頁顯示的記錄數字
    queryParam :'drug.itemName' // 在combox內敲入字符時候，combox向后臺查詢傳遞的參數,這里設置為'drug.itemName'是為了更好的封裝，默認傳遞參數‘query’
    });

這里還有一個問題，就是Combox設置初始值。
我是采用如下做法的，不知道各位知不知道其他用法？

var subjectField = new Ext.form.ComboBox({
   fieldLabel : '分類名稱',
   hiddenName : 'drug.subjectCode',
   store : new Ext.data.SimpleStore({
   autoLoad : true,
   url : 'xxx',
   fields : ['subjectCode', 'subjectName'],
   listeners : {
      load : function(){         subjectField.setValue(record.get("drug.subjectCode"));
   }
   }
   }),
   valueField : 'subjectCode',
   displayField : 'subjectName',
   typeAhead : true,
   mode : 'local',
   triggerAction : 'all',
   emptyText : '請選擇一個分類名',
   selectOnFocus : true,
   anchor : '90%',
   forceSelection : true
   });

原文出自：

http://www.iteye.com/topic/296710

posted @ 2013-03-02 21:43 小胡子閱讀(888) | 評論 (0) | 編輯收藏

【轉】jquery sortable..筆記

所有的事件回調函數都有兩個參數：event和ui，瀏覽器自有event對象，和經過封裝的ui對象
ui.helper - 表示sortable元素的JQuery對象，通常是當前元素的克隆對象
ui.position - 表示相對當前對象，鼠標的坐標值對象{top,left}
ui.offset - 表示相對于當前頁面，鼠標的坐標值對象{top,left}
ui.item - 表示當前拖拽的元素
ui.placeholder - 占位符（如果有定義的話）
ui.sender - 當前拖拽元素的所屬sortable對象（僅當元素是從另一個sortable對象傳遞過來時有用）

·參數（參數名 : 參數類型 : 默認值）
appendTo : String : 'parent'
Defines where the helper that moves with the mouse is being appended to during the drag (for example, to resolve overlap/zIndex issues).
初始：$('.selector').sortable({ appendTo: 'body' });
獲取：var appendTo = $('.selector').sortable('option', 'appendTo');
設置：$('.selector').sortable('option', 'appendTo', 'body');

axis : String : false
如果有設置，則元素僅能橫向或縱向拖動。可選值：'x', 'y'
初始：$('.selector').sortable({ axis: 'x' });
獲取：var axis = $('.selector').sortable('option', 'axis');
設置：$('.selector').sortable('option', 'axis', 'x');

cancel : Selector : ':input,button'
阻止排序動作在匹配的元素上發生。
初始：$('.selector').sortable({ cancel: 'button' });
獲取：var cancel = $('.selector').sortable('option', 'cancel');
設置：$('.selector').sortable('option', 'cancel', 'button');

connectWith : Selector : false
允許sortable對象連接另一個sortable對象，可將item元素拖拽到另一個中。
初始：$('.selector').sortable({ connectWith: '.otherlist' });
獲取：var connectWith = $('.selector').sortable('option', 'connectWith');
設置：$('.selector').sortable('option', 'connectWith', '.otherlist');

containment : Element, String, Selector : false
約束排序動作只能在一個指定的范圍內發生。可選值：DOM對象, 'parent', 'document', 'window', 或jQuery對象
初始：$('.selector').sortable({ containment: 'parent' });
獲取：var containment = $('.selector').sortable('option', 'containment');
設置：$('.selector').sortable('option', 'containment', 'parent');

cursor : String : 'auto'
定義在開始排序動作時，如果的樣式。
初始：$('.selector').sortable({ cursor: 'crosshair' });
獲取：var cursor = $('.selector').sortable('option', 'cursor');
設置：$('.selector').sortable('option', 'cursor', 'crosshair');

cursorAt : Object : false
當開始移動時，鼠標定位在的某個位置上（最多兩個方向）。可選值：{ top, left, right, bottom }.
初始：$('.selector').sortable({ cursorAt: 'top' });
獲取：var cursorAt = $('.selector').sortable('option', 'cursorAt');
設置：$('.selector').sortable('option', 'cursorAt', 'top');

delay : Integer : 0
以毫秒為單位，設置延遲多久才激活排序動作。此參數可防止誤點擊。
初始：$('.selector').sortable({ delay: 500 });
獲取：var delay = $('.selector').sortable('option', 'delay');
設置：$('.selector').sortable('option', 'delay', 500);

distance : Integer : 1
決定至少要在元素上面拖動多少像素后，才正式觸發排序動作。
初始：$('.selector').sortable({ distance: 30 });
獲取：var distance = $('.selector').sortable('option', 'distance');
設置：$('.selector').sortable('option', 'distance', 30);

dropOnEmpty : Boolean : true
是否允許拖拽到一個空的sortable對象中。
初始：$('.selector').sortable({ dropOnEmpty: false });
獲取：var dropOnEmpty = $('.selector').sortable('option', 'dropOnEmpty');
設置：$('.selector').sortable('option', 'dropOnEmpty', false);

forceHelperSize : Boolean : false
If true, forces the helper to have a size.
初始：$('.selector').sortable({ forceHelperSize: true });
獲取：var forceHelperSize = $('.selector').sortable('option', 'forceHelperSize');
設置：$('.selector').sortable('option', 'forceHelperSize', true);

forcePlaceholderSize : Boolean : false
If true, forces the placeholder to have a size.
初始：$('.selector').sortable({ forcePlaceholderSize: true });
獲取：var forcePlaceholderSize = $('.selector').sortable('option', 'forcePlaceholderSize');
設置：$('.selector').sortable('option', 'forcePlaceholderSize', true);

grid : Array : false
將排序對象的item元素視為一個格子處理，每次移動都按一個格子大小移動，數組值：[x,y]
初始：$('.selector').sortable({ grid: [50, 20] });
獲取：var grid = $('.selector').sortable('option', 'grid');
設置：$('.selector').sortable('option', 'grid', [50, 20]);

handle : Selector, Element : false
限制排序的動作只能在item元素中的某個元素開始。
初始：$('.selector').sortable({ handle: 'h2' });
獲取：var handle = $('.selector').sortable('option', 'handle');
設置：$('.selector').sortable('option', 'handle', 'h2');

helper : String, Function : 'original'
設置是否在拖拽元素時，顯示一個輔助的元素。可選值：'original', 'clone'
初始：$('.selector').sortable({ helper: 'clone' });
獲取：var helper = $('.selector').sortable('option', 'helper');
設置：$('.selector').sortable('option', 'helper', 'clone');

items : Selector : '> *'
指定在排序對象中，哪些元素是可以進行拖拽排序的。
初始：$('.selector').sortable({ items: 'li' });
獲取：var items = $('.selector').sortable('option', 'items');
設置：$('.selector').sortable('option', 'items', 'li');

opacity : Float : false
定義當排序時，輔助元素(helper)顯示的透明度。
初始：$('.selector').sortable({ opacity: 0.6 });
獲取：var opacity = $('.selector').sortable('option', 'opacity');
設置：$('.selector').sortable('option', 'opacity', 0.6);

placeholderType: StringDefault: false
設置當排序動作發生時，空白占位符的CSS樣式。
初始：$('.selector').sortable({ placeholder: 'ui-state-highlight' });
獲取：var placeholder = $('.selector').sortable('option', 'placeholder');
設置：$('.selector').sortable('option', 'placeholder', 'ui-state-highlight');

revert : Boolean : false
如果設置成true，則被拖拽的元素在返回新位置時，會有一個動畫效果。
初始：$('.selector').sortable({ revert: true });
獲取：var revert = $('.selector').sortable('option', 'revert');
設置：$('.selector').sortable('option', 'revert', true);

scroll : Boolean : true
如果設置成true，則元素被拖動到頁面邊緣時，會自動滾動。
初始：$('.selector').sortable({ scroll: false });
獲取：var scroll = $('.selector').sortable('option', 'scroll');
設置：$('.selector').sortable('option', 'scroll', false);

scrollSensitivity : Integer : 20
設置當元素移動至邊緣多少像素時，便開始滾動頁面。
初始：$('.selector').sortable({ scrollSensitivity: 40 });
獲取：var scrollSensitivity = $('.selector').sortable('option', 'scrollSensitivity');
設置：$('.selector').sortable('option', 'scrollSensitivity', 40);

scrollSpeed : Integer : 20
設置頁面滾動的速度。
初始：$('.selector').sortable({ scrollSpeed: 40 });
獲取：var scrollSpeed = $('.selector').sortable('option', 'scrollSpeed');
設置：$('.selector').sortable('option', 'scrollSpeed', 40);

tolerance : String : 'intersect'
設置當拖動元素越過其它元素多少時便對元素進行重新排序。可選值：'intersect', 'pointer'
intersect：至少重疊50%
pointer：鼠標指針重疊元素
初始：$('.selector').sortable({ tolerance: 'pointer' });
獲取：var tolerance = $('.selector').sortable('option', 'tolerance');
設置：$('.selector').sortable('option', 'tolerance', 'pointer');

zIndex : Integer : 1000
設置在排序動作發生時，元素的z-index值。
初始：$('.selector').sortable({ zIndex: 5 });
獲取：var zIndex = $('.selector').sortable('option', 'zIndex');
設置：$('.selector').sortable('option', 'zIndex', 5);

·事件

start
當排序動作開始時觸發此事件。
定義：$('.selector').sortable({ start: function(event, ui) { ... } });
綁定：$('.selector').bind('sortstart', function(event, ui) { ... });

sort
當元素發生排序時觸發此事件。
定義：$('.selector').sortable({ sort: function(event, ui) { ... } });
綁定：$('.selector').bind('sort', function(event, ui) { ... });

change
當元素發生排序且坐標已發生改變時觸發此事件。
定義：$('.selector').sortable({ change: function(event, ui) { ... } });
綁定：$('.selector').bind('sortchange', function(event, ui) { ... });

beforeStop
當排序動作結束之前觸發此事件。此時占位符元素和輔助元素仍有效。
定義：$('.selector').sortable({ beforeStop: function(event, ui) { ... } });
綁定：$('.selector').bind('sortbeforeStop', function(event, ui) { ... });

stop
當排序動作結束時觸發此事件。
定義：$('.selector').sortable({ stop: function(event, ui) { ... } });
綁定：$('.selector').bind('sortstop', function(event, ui) { ... });

update
當排序動作結束時且元素坐標已經發生改變時觸發此事件。
定義：$('.selector').sortable({ update: function(event, ui) { ... } });
綁定：$('.selector').bind('sortupdate', function(event, ui) { ... });

receive
當一個已連接的sortable對象接收到另一個sortable對象的元素后觸發此事件。
定義：$('.selector').sortable({ receive: function(event, ui) { ... } });
綁定：$('.selector').bind('sortreceive', function(event, ui) { ... });

over
當一個元素拖拽移入另一個sortable對象后觸發此事件。
定義：$('.selector').sortable({ over: function(event, ui) { ... } });
綁定：$('.selector').bind('sortover', function(event, ui) { ... });

out
當一個元素拖拽移出sortable對象移出并進入另一個sortable對象后觸發此事件。
定義：$('.selector').sortable({ out: function(event, ui) { ... } });
綁定：$('.selector').bind('sortout', function(event, ui) { ... });

activate
當一個有使用連接的sortable對象開始排序動作時，所有允許的sortable觸發此事件。
定義：$('.selector').sortable({ activate: function(event, ui) { ... } });
綁定：$('.selector').bind('sortactivate', function(event, ui) { ... });

deactivate
當一個有使用連接的sortable對象結束排序動作時，所有允許的sortable觸發此事件。
定義：$('.selector').sortable({ deactivate: function(event, ui) { ... } });
綁定：$('.selector').bind('sortdeactivate', function(event, ui) { ... });

·方法
destory
從元素中移除拖拽功能。
用法：.sortable( 'destroy' )

disable
禁用元素的拖拽功能。
用法：.sortable( 'disable' )

enable
啟用元素的拖拽功能。
用法：.sortable( 'enable' )

option
獲取或設置元素的參數。
用法：.sortable( 'option' , optionName , [value] )

serialize
獲取或設置序列化后的每個item元素的id屬性。
用法：.sortable( 'serialize' , [options] )

toArray
獲取序列化后的每個item元素的id屬性的數組。
用法：.sortable( 'toArray' ）

refresh
手動重新刷新當前sortable對象的item元素的排序。
用法：.sortable( 'refresh' )

refreshPositions
手動重新刷新當前sortable對象的item元素的坐標，此方法可能會降低性能。
用法：.sortable( 'refreshPositions' )

cancel
取消當前sortable對象中item元素的排序改變。
用法：.sortable( 'cancel' )

排序后保存有兩種方法，一是cookie，二是數據庫配置文件等。
這個是cookie 的例子大家可以參考 http://www.cnblogs.com/tianxiangbing/archive/2010/01/26/jquery_sortable.html

下面是數據庫的部分代碼原作：
    $(function() {
        var show = $(".loader");
        var orderlist = $(".orderlist");
        var listleft = $("div[id = 'column_left']");
        var listcenter = $("div[id = 'column_center']");
        var listright = $("div[id = 'column_right']");
        $( ".column" ).sortable({
        opacity: 0.5,//拖動的透明度
        revert: true, //緩沖效果
        cursor: 'move', //拖動的時候鼠標樣式
        connectWith: ".column",
        //開始用update 結果執行兩次，浪費資源，古改成stop
        //但是stop在元素沒有改變位置的時候也會執行，
        //用update其他js會有問題，^_^
        stop: function(){
            var new_order_left = []; //左欄布局
            var new_order_center = [];//中欄布局
            var new_order_right = [];//右欄布局
            listleft.children(".portlet").each(function() {
                new_order_left.push(this.title);
             });
            listcenter.children(".portlet").each(function() {
                new_order_center.push(this.title);
             });
            listright.children(".portlet").each(function() {
                new_order_right.push(this.title);
             });
            var newleftid = new_order_left.join(',');
            var newcenterid = new_order_center.join(',');
            var newrightid = new_order_right.join(',');
            $.ajax({
               type: "post",
               url: jsonUrl, //服務端處理程序
               data: { leftid: newleftid, centerid: newcenterid, rightid:newrightid},   //id:新的排列對應的ID,order：原排列順序
//               beforeSend: function() {
//                    show.html(" 正在更新");
//               },
               success: function(msg) {
                    //alert(msg);
                    show.html("");
               }
            });
       }
        });

原文出自：

http://hb-keepmoving.iteye.com/blog/1154618

posted @ 2013-03-01 12:44 小胡子閱讀(484) | 評論 (0) | 編輯收藏

【轉】10 個很棒的 jQuery 代碼片段

圖片預加載

1 (function($) {
2   var cache = [];
3   // Arguments are image paths relative to the current page.
4   $.preLoadImages = function() {
5     var args_len = arguments.length;
6     for (var i = args_len; i--;) {
7       var cacheImage = document.createElement('img');
8       cacheImage.src = arguments[i];
9       cache.push(cacheImage);
10     }
11   }
12
13 jQuery.preLoadImages("image1.gif", "/path/to/image2.png");

在新窗口打開鏈接 (target=”blank”)

1 $('a[@rel$='external']').click(function(){
2      this.target = "_blank";
3 });
4
5 /*
6    Usage:
7    <a >catswhocode.com</a>
8 */

當支持 JavaScript 時為 body 增加 class

1 /* 該代碼只有1行，但是最簡單的用來檢測瀏覽器是否支持 JavaScript 的方法，如果支持 JavaScript 就在 body 元素增加一個 hasJS 的 class */
2 $('body').addClass('hasJS');

平滑滾動頁面到某個錨點

1 $(document).ready(function() {
2     $("a.topLink").click(function() {
3         $("html, body").animate({
4             scrollTop: $($(this).attr("href")).offset().top + "px"
5         }, {
6             duration: 500,
7             easing: "swing"
8         });
9         return false;
10     });
11 });

鼠標滑動時的漸入和漸出

1 $(document).ready(function(){
2     $(".thumbs img").fadeTo("slow", 0.6); // This sets the opacity of the thumbs to fade down to 60% when the page loads
3
4     $(".thumbs img").hover(function(){
5         $(this).fadeTo("slow", 1.0); // This should set the opacity to 100% on hover
6     },function(){
7         $(this).fadeTo("slow", 0.6); // This should set the opacity back to 60% on mouseout
8     });
9 });

制作等高的列

1 var max_height = 0;
2 $("div.col").each(function(){
3 if ($(this).height() > max_height) { max_height = $(this).height(); }
4 });
5 $("div.col").height(max_height);

在一些老的瀏覽器上啟用 HTML5 的支持

1 (function(){
2     if(!/*@cc_on!@*/0)
3         return;
4     var e = "abbr,article,aside,audio,bb,canvas,datagrid,datalist,details,dialog,eventsource,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,time,video".split(','),i=e.length;while(i--){document.createElement(e[i])}
5 })()
6
7 //然后在head中引入該js
8

測試瀏覽器是否支持某些 CSS3 屬性

1 var supports = (function() {
2    var div = document.createElement('div'),
3       vendors = 'Khtml Ms O Moz Webkit'.split(' '),
4       len = vendors.length;
5
6    return function(prop) {
7       if ( prop in div.style ) return true;
8
9       prop = prop.replace(/^[a-z]/, function(val) {
10          return val.toUpperCase();
11       });
12
13       while(len--) {
14          if ( vendors[len] + prop in div.style ) {
15             // browser supports box-shadow. Do what you need.
16             // Or use a bang (!) to test if the browser doesn't.
17             return true;
18          }
19       }
20       return false;
21    };
22 })();
23
24 if ( supports('textShadow') ) {
25    document.documentElement.className += ' textShadow';

獲取 URL 中傳遞的參數

1 $.urlParam = function(name){
2     var results = new RegExp('[\\?&]' + name + '=([^&#]*)').exec(window.location.href);
3     if (!results) { return 0; }
4     return results[1] || 0;
5 }

禁用表單的回車鍵提交

1 $("#form").keypress(function(e) {
2   if (e.which == 13) {
3     return false;
4   }
5 });

posted @ 2013-03-01 09:53 小胡子閱讀(279) | 評論 (0) | 編輯收藏

【轉】體驗魅力 Cognos BI 10 系列，第 5 部分: 第一個元數據模型

摘要: 為什么需要元數據模型您已經熟悉使用 Cognos 來創建報表，進行自助式設計分析，然而這些需要的創建的應用都依賴于對應的元數據模型，用戶使用元數據模型對他們的數據源進行分析和報告。元數據模型是整個 Cognos 應用的基礎，它是一個或多個數據源中信息的業務演示。基于這個基礎，您才能夠創建報表，進行自助式設計分析。 Cognos 能支持多種數據源，包括關系型的和多維的數據庫。元數據模型能隱藏底... 閱讀全文

posted @ 2013-02-26 14:21 小胡子閱讀(937) | 評論 (0) | 編輯收藏

【轉】體驗魅力 Cognos BI 10 系列，第 5 部分: 第一個自助式設計分析

什么是自助式設計分析

自助式設計分析是指在業務人員在同一工具做即席查詢、報表和分析，完全由業務用戶自助式制作。并且能和自助式儀表盤、專業報表工具緊密集成。通過業務人員進行自助式設計分析可以提升業務敏捷度、提升客戶滿意度、快速報表制作、降低 IT 管理成本。

IBM Cognos Business Insight Advanced 是用于創建報表和分析數據的基于 Web 的工具。商業用戶可通過此用戶界面了解其業務。IBM Cognos Business Insight Advanced 屬于一種新型報表使用環境，將為商業用戶帶來全面的商業智能體驗。

在《第一個自助式儀表盤》介紹了使用 IBM Cognos Business Insight 創建復雜的交互式儀表盤并以預定義的方式瀏覽內容。在 Business Insight 儀表盤中，可處理現有的內容并進行基本分析、數據瀏覽和協作性決策的制定。如果要執行深入分析并要創建報表，可以切換到 Business Insight Advanced 來執行更高級的數據瀏覽，例如添加附加度量、條件格式化和高級計算。

在 IBM Cognos BI 10.1 版本以前，IBM Cognos Report Studio 中的“專業”和“快速”兩種創建模式，從 IBM Cognos BI 10.1 版本開始，“快速”創建模式現已替換為 IBM Cognos Business Insight Advanced，專業 IT 報表創建者仍使用 Report Studio 工具創建高級報表。

Business Insight Advanced 由業務人員使用，提供比原來“快速”創建模式的功能更為強大，例如完全支持列表報表、圖表和關系數據源，而且還提供了專用于數據瀏覽的全新用戶體驗。 Business Insight Advanced 用戶界面重點是在瀏覽數據。因此某些默認行為與以前版本的 IBM Cognos Report Studio 中“快速”創建模有所不同。例如，默認情況下，在 Business Insight Advanced 雙擊項目現將執行向下追溯。

不論是 IBM Cognos BI 的 Report Studio、Query Studio、Analysis Studio 制作的報表，IBM Cognos Business Insight Advanced 都可以打開，并且可以由業務人員進行自助式設計分析。而 Query Studio、Analysis Studio 功能已經被 Business Insight Advanced 取代，所以 Cognos BI 10 的業務用戶只需要使用 Business Insight Advanced 就足夠了。Report Studio 則留給專業人員使用。

創建第一個自助式設計分析

在開始菜單中啟動 IBM Cognos BI Developer Edition，運行 Developer Edition Manager，在確保左側的服務都正常的情況下，點擊右上角的啟動，選擇 Business Insight Advanced。
在“Cognos > 公共文件夾 > 示樣 > 多維數據集”路徑下，選擇“Great Outdoors Sales (cube)”數據包，進入 IBM Cognos Business Insight Advanced 后選擇“新建”。在選擇報表類型的時候，選擇“交叉表”，點擊確定。
如果載入數據包報錯，例如在內容存儲庫中找不到數據源“great_outdoors_sales_en”，則需要按照《第一次安裝》的步驟檢查是否正確建立了 PowerCube 數據源。
在右側的“可插入對象”窗格中的“來源”選項卡顯示了面向成員的數據視圖。您可以看到維度數據源，也就是包括多維數據源或者按維度建模的關系數據源，在本教程中使用的是 PowerCube 多維數據源。
- 數據包是模型的子集，其中包含可以插入到報表中的項目。
- 維度是有關業務主要方面（如產品、日期或市場）的描述性數據的概括分組。
- 級別層級是維度內更具體的分組。例如，對于“年份”維度，可以將數據組織為較小的組，如“年份”、“當前月份”和“上一個月份”。
- 成員文件夾包含可用于層級或級別的成員。例如，“年”級別層級的“成員”文件夾包含“年”、“季度”和“月份”級別中的所有內容。
- 級別是包含相同詳細程度信息并具有共同屬性的維度層級內的位置。一個級別層級內可以存在多個級別，從根級別開始。例如，“年份”級別層級具有以下相關級別。
- 成員屬性是每個成員所具有的屬性。例如，性別可以是所有員工成員的屬性。
圖 1. 可插入對象
對于維度模型數據源，您可以通過單擊樹面板頂部的按鈕來交替查看元數據樹和面向成員的數據樹。在本教程中選擇“查看成員樹”。然后把 Years 拖動到列，把 Products 拖動到行，把 Revenue 拖動到度量，如圖 2 所示。

圖 2. 查看成員樹
接下來您可以了解一下在 Business Insight Advanced 展示數據的功能。使用維度數據源或按維度建模的關系數據源時，您可以向下追溯到較低級別數據集或向上追溯到較高級別數據集的報表。向上追溯和向下追溯允許您在預定義的維度層級（例如“年 - 年 - 季度 - 月”）內查看有關數據的更加全面或更加詳細的信息，而無需創建其他報表。
左鍵點擊交叉表中的產品“Golf Equipment”兩次，可以實現向下追溯的功能。雙擊第一列最后一行匯總標題上的“Golf Equipment”可以實現向上追溯的功能。

其實在交叉表里面的任意數據都可以實現向下追溯的功能，而選擇匯總標題上的數據都可以實現向上追溯的功能。
在“Golf Equipment”的向下追溯的效果下，單擊成員“Golf Accessories”，在數據菜單下選擇“瀏覽”，再單擊“替換”，然后單擊“使用級別成員”，如圖 3 所示。

圖 3. 替換成員

這樣就把“Golf Accessories”替換為相同級別的成員。為了幫助理解，可以參看圖 4，展開面向成員的數據樹，和“Golf Accessories”相同級別的成員是標注紅色的那些數據項。

圖 4. 級別成員
等待報表刷新后，右鍵選擇任意產品類型，點擊菜單“最高或最低”，選擇“最高 5 （基于 Revenue, Years）”，這樣就篩選出最高的 5 個產品類型。

圖 5. 最高或最低
右鍵選擇匯總標題上的“Golf Equipment”，點擊“刪除”，這樣就可以把不需要的匯總行除去，如圖 6 所示。

圖 6. 刪除匯總行
按住 Ctrl 鍵選擇“Tents”和“Packs”兩個產品類型，右鍵選擇“排除成員 > 從初始集”，如圖 7 所示。您會發現仍然是 5 個產品類型，但是已經不是原來的 5 個，“Tents”和“Packs”兩個產品類型已經被換成另外兩個。
而如果您剛才選擇“排除成員 > 從當前集”，則就會剩下 3 個產品類型。

圖 7. 排除成員
在右側的“可插入對象”窗格中的“來源”選項卡中選擇“Personal Accessories”產品類型下的后面四個成員拖拽到報表的最后一行后面，如圖 8 所示。

圖 8. 添加成員
您會看到報表有 9 個產品類型，它們分別來自兩個數據集。其中 Watches 和 Eyewear 這兩個產品類型在兩個數據集里面都有，屬于重復的產品類型。
您按住 Ctrl 鍵可以選擇兩個數據集的 Eyewear，這樣就等同于選擇了兩個數據集。然后在數據菜單下選擇“瀏覽”，再單擊“合并到一個集中”，選擇“刪除重復項”，如圖 9 所示。

圖 9. 合并數據集
這樣就剩下合并在一個數據集中的 7 個產品類型，Watches 和 Eyewear 也沒有重復了。
右鍵選擇任意產品類型，點擊菜單“最高或最低”，選擇“最低 5 （基于 Revenue, Years）”，這樣就篩選出最低的 5 個產品類型。
按住 Ctrl 鍵選擇 Packs 和 Navigation 兩個產品類型，右鍵選擇“移動成員”，點擊 “到頂部”，如圖 10 所示。Packs 和 Navigation 兩個產品類型就會被放到報表的頭兩行。

圖 10. 移動成員
剛才您做了很多數據集的操作，這些操作包括：
- 排除成員
- 將成員移到集的頂部或底部
- 聯接多個集
- 應用最高或最低過濾器
- 過濾集
- 展開或折疊集合中的成員
在 IBM Cognos Business Insight Advanced 可以查看集定義，從而了解、更改、添加或刪除可對該集執行的操作，集的定義以圖形樹的形式為您顯示了對集執行的所有操作的歷史記錄。

您可以任意選擇數據項，比如 Packs ，然后右鍵菜單選擇“編輯集”。或者您也可以在“數據”菜單下選擇“瀏覽”，找到“編輯集”的菜單項。

圖形樹顯示了對成員集合執行的所有操作，如圖 11 所示。您可以執行以下操作，在這里選擇“取消”即可。
- 要查看操作詳情，請將鼠標懸停在操作節點上。
- 要更改操作的順序，請單擊操作節點，然后單擊向右箭頭或向左箭頭。
- 要編輯操作，請單擊操作節點，然后單擊“編輯”按鈕。
- 要添加新操作，請單擊“新建”按鈕。
圖 11. 編輯集
任意選擇報表的數據項，右鍵選擇“顯示屬性”，這樣會展開報表的屬性頁。您可以設置報表的屬性。

圖 12. 設置屬性
保存您的分析結果在“我的文件夾”下，命名為“第一個自助式設計分析”。

使用圖表

IBM Cognos Business Insight Advanced 包含一種默認圖表技術，該技術不同于 10.1 之前版本中使用的原始圖表技術。“使用原始圖表創建”選項，讓您能夠使用老版本的原始圖表技術的報表，而不是默認的 Business Insight Advanced 圖表來創建新的報表。

在《第一張交互式離線報表》，您已經去掉“使用原始圖表創建”的選擇，這里可以再檢查一下。您可以在“工具”菜單中點擊“選項”，在“高級選項”標簽中，檢查是否已經去掉“使用原始圖表創建”的選擇。

IBM Cognos Business Insight Advanced 包含豐富的圖表類型：

柱形圖：對于比較離散數據或顯示隨時間變化的趨勢非常有用。
折線圖：對于顯示隨時間變化的趨勢和比較多個數據序列非常有用。
餅形圖：對于突出顯示比例非常有用。
條形圖：對于顯示隨時間變化的趨勢和繪制多個數據序列非常有用。
面積圖：對于強調隨時間變化的更改量非常有用，堆積面積圖還用于顯示部分與整體的關系。
點狀圖：對于以非群集樣式顯示定量數據非常有用。
組合圖：通過在一個圖表內使用柱形圖、面積圖和折線圖的組合，繪出多個數據序列。組合圖對于突出顯示各種數據序列之間的關系非常有用。
散點圖：使用數據點來沿刻度的任何位置（不僅在常規刻度線處）繪出兩個度量，對于瀏覽不同數據集之間的相互關系非常有用。
泡形圖：使用數據點和氣泡沿某一刻度的任意位置繪出度量，就像散點圖一樣，氣泡的大小表示第三個度量，對于表示財務數據非常有用。
項目符號圖表：是條形圖的一個變體。它們可以將特色度量（項目符號）與目標度量（目標）進行對比，也可以將比對度量與背景中提供其他定性度量（如“非常滿意”、“滿意”和“不滿意”）的彩色區域聯系到一起，通常用于代替執行儀表盤中的儀表板圖。
儀表板圖：使用指針將信息顯示為表盤上的讀數。在有顏色的數據范圍或圖表軸上讀取每個指針的值非常容易。此圖表類型常用于執行儀表盤報表，以顯示關鍵業務指示器。
排列圖：通過標識事件的主要原因來幫助您改善這些過程。排列圖按照從最頻繁到最不頻繁的順序對類別進行排名。這些圖表常用于質量控制數據，以便您確定并減少問題的主要來源。
漸進圖：類似于堆積圖，單個堆積的各分段都從下一分段垂直偏移，對于強調各分段占整體的比例非常有用。
象限圖：將背景分成四個等區域的泡形圖。象限圖對于繪出包含三個度量（使用 X 軸、Y 軸和表示第三個度量值的氣泡大小）的數據很有用。
Marimekko 圖表：是百分堆積圖，其中列的寬度與列值的總和成正比，各個分段高度是各自列總值的百分比。
雷達圖：將多個軸組合成一個放射狀的圖形。對于每個數字，均沿著從圖表中心開始的單獨軸繪出數據。
盈虧圖表：是一種 Microchart 圖，其中每列的值為 1 或 -1，通常表示盈利或虧損。
極坐標圖：對于顯示科學計算數據非常有用，是使用值和角度將信息顯示為極坐標的圓形圖。

在工具欄中找到“頁面布局”，為報表選擇預定義的頁面布局。您選擇 1x2 的布局，這樣就能在報表旁邊放置圖表，如圖 13 所示。頁面刷新后，報表出現在左側的單元格，而右側的單元格是空著的。

圖 13. 頁面布局
在右側的“工具箱”中選擇圖表，拖拽到右側的單元格中。當“插入圖表”提示出現時，選擇餅形圖，如圖 14 所示。

圖 14. 插入圖表
在右側的“來源”中選擇 Gross Profit 拖拽到默認度量，把 Sales Regions 拖拽到序列（餅形圖扇區）。
您可以嘗試在餅形圖上進行向下追溯和向上追溯的功能。右鍵選擇餅形扇區，然后單擊“向下追溯”或者“向上追溯”。
您可以將餅形扇區拉離剩余的餅形圖，以突出顯示餅形扇區。右鍵選擇要拉出的餅形扇區，然后單擊“分解扇區”。此時扇區會從圖表中拉出。要使已拉出的扇區返回到餅形圖中，請右鍵選擇餅形圖圖表對象，然后單擊“刪除已分解的扇區”。
您在“查看”菜單下可以切換“頁面設計”和“頁面預覽”，其中“頁面預覽”是缺省選擇，這是給業務人員進行自助式設計分析用的，所見即所得，可以直接看到數據結果。而“頁面設計”功能是給專業人員用的，界面類似即將在后面介紹的 Report Studio。
保存并退出 Business Insight Advanced。

在自助式儀表盤中打開

在開始菜單中啟動 IBM Cognos BI Developer Edition，運行 Developer Edition Manager，在確保左側的服務都正常的情況下，點擊右上角的啟動，選擇 Business Insight。在 IBM Cognos Business Insight 的啟動頁上選擇“新建”。
在右側的可插入對象中選擇下面的“內容”，在“我的文件夾”下，可以找到剛才保存的“第一個自助式設計分析”，展開可以發現有兩個對象，分別是“交叉表 1”和“餅形圖 1”。右鍵選擇“第一個自助式設計分析”報表，選擇“插入”。
在自助式儀表盤中，您如果想看除了報表里面 5 個產品類型以外的產品，比如想把 Lanterns 產品類型也添加到報表中。那就不能直接在 Business Insight 里面完成，可以通過選擇菜單的齒輪形狀的按鈕“完成更多”來啟動 Business Insight Advanced，如圖 15 所示。等待一會以后，Business Insight Advanced 界面就出現了。

圖 15. 完成更多
默認情況下，當您使用 IBM Cognos Business Insight Advanced 將源目錄樹中的成員插入到報表中時，成員將與其子項一起以集 [ 創建成員集 ] 的形式插入。您可以更改成員的插入方式。因為現在只想添加 Lanterns 產品類型，所以想要插入不帶子項的成員。
為此，在“可插入對象”窗格的“來源”選項卡上，單擊“插入帶子項的成員”按鈕，并選擇插入成員的方式，選擇“插入單個成員”，如圖 16 所示。

圖 16. 插入單個成員
然后在 Products > Camping Equipment 路徑下，把 Lanterns 拖拽到報表的最后一行，注意等到有閃爍行線出現時再松開鼠標。
這樣就有 6 個產品類型出現在報表中，Lanterns 產品類型出現在報表的最后一行。點擊右上角的“完成”回到 Business Insight 的儀表盤窗口。
值得注意的是，現在修改的報表僅僅是改變自助式儀表盤的數據，而不影響原先的報表“第一個自助式設計分析”。因此您可以在自助式儀表盤里面引用自助式設計分析的結果，也可以隨時利用自助式設計分析的強大功能來彌補自助式儀表盤的不足。Business Insight 和 Business Insight Advanced 兩者無縫集成，不需要切換。

總結

您可以使用兩種不同的方式打開 Business Insight Advanced：
- 從執行報表高級編輯（“完成更多”）的 Business Insight 儀表盤中打開。這種方式適合業務人員在自助式儀表盤里面想進一步進行自助分析。
- 從 IBM Cognos Connection 的“啟動”菜單中打開或從歡迎頁面（“創建者業務報表”）中打開。這種方式適合業務人員進行自助設計分析。
Business Insight Advanced 是給業務人員進行自助式設計分析用的。在《第一次安裝》中，您曾經用 Report Studio 構建了第一張簡單報表，而 Report Studio 是給專業人士使用的報表工具。您可以用 Report Studio 來打開剛才保存的“第一個自助式設計分析”。

在開始菜單中啟動 IBM Cognos BI Developer Edition，運行 Developer Edition Manager，在確保左側的服務都正常的情況下，點擊右上角的啟動，選擇 Report Studio。在“Cognos > 公共文件夾 > 示樣 > 多維數據集”路徑下，選擇“Great Outdoors Sales (cube)”數據包，進入 IBM Report Studio 后選擇“打開現有的”。在“我的文件夾”下，可以找到剛才保存的“第一個自助式設計分析”，點擊“打開”。

您可以看到 Report Studio 提供了給專業報表創建者的許多功能，下面舉例說明 Business Insight Advanced 不能實現而 Report Studio 可以完成的功能。
- 在 Report Studio 中間的“查詢資源管理器”，您可以創建或修改關系報表 [ 使用關系查詢 ] 或維度報表 [ 使用維度查詢 ] 中的查詢，以及執行復雜任務，如定義合并聯接和寫入 SQL 語句，如圖 17 所示。在 Business Insight Advanced，您不能看到也不能操控查詢。
  
  圖 17. 查詢資源管理器
- 點擊交叉表的左上方的三個小紅點，選擇交叉表，您可以看到交叉表的屬性，如圖 18 所示。這里有一些屬性是 Business Insight Advanced 無法編輯的。比如在“其他”類別里面的“名稱”，這里的名稱就是您剛才在 Business Insight 中進行自助式儀表盤時候看到的對象名稱。您可以在 Report Studio 把它修改成更有意義的名字，比如“產品線收入表”。
  
  圖 18. 交叉表屬性

posted @ 2013-02-26 14:15 小胡子閱讀(545) | 評論 (0) | 編輯收藏

僅列出標題

jQuery Tooltip Plugins

qTip2

Tooltipster

Tooltipsy

clueTip

PowerTip

wTooltip

Tipped

Responsive and Mobile-Friendly Tooltip

tinytooltip

Tipsy

Sticky Tooltip

jQuery Tools Tooltip

EZPZ Tooltip

Gips

JQuery Tooltip Plugin

BsTip

ChillTip

TipTip

Colortip

jQuery and CSS3 Simple Tooltip

添加代碼到編輯器

使用額外的參數

CSS代碼

圖片預加載

在新窗口打開鏈接 (target=”blank”)

當支持 JavaScript 時為 body 增加 class

平滑滾動頁面到某個錨點

鼠標滑動時的漸入和漸出

制作等高的列

在一些老的瀏覽器上啟用 HTML5 的支持

測試瀏覽器是否支持某些 CSS3 屬性

獲取 URL 中傳遞的參數

禁用表單的回車鍵提交

日歷

常用鏈接

留言簿(1)

隨筆分類

隨筆檔案

文章檔案

搜索

最新評論

閱讀排行榜

評論排行榜