<rt id="bn8ez"></rt>
<label id="bn8ez"></label>

  • <span id="bn8ez"></span>

    <label id="bn8ez"><meter id="bn8ez"></meter></label>

    倉藍

    日記本

      BlogJava :: 首頁 :: 聯(lián)系 :: 聚合  :: 管理
      23 Posts :: 0 Stories :: 1 Comments :: 0 Trackbacks

    2014年1月10日 #

         摘要: 適合Linux系統(tǒng)使用的命令,本文以亞馬遜的Amazon Linux 為用例,希望對朋友們有點幫助!切換至root用戶    sudo su  安裝screen    yum install screen       yum update  安裝Apache,MySQL...  閱讀全文
    posted @ 2014-01-10 10:45 cangshi 閱讀(1760) | 評論 (0)編輯 收藏

    2014年1月8日 #

    希望WP愛好者能夠喜歡并嘗試一下‘

    1.樣式表

    1. /*SidebarTabsAd*/  
    2. #cwpad_box{width:100%;text-align:center}   
    3. #cwpad_box ul, #cwpad_box dd, #cwpad_box tt{   
    4.     margin:0px;   
    5.     padding:0px;   
    6.     float:left;   
    7.     list-style: none;   
    8. }   
    9. #cwpad_box{   
    10.     width:313px;/*250px+(n-1)*21px*/  
    11.     height:250px;   
    12.     border-left: 1px solid #740a20;   
    13. }   
    14. #cwpad_box dd{   
    15.     width:21px;   
    16.     height:250px;   
    17.     overflow:hidden;   
    18.     position:relative;   
    19. }   
    20. #cwpad_box dd.hove{   
    21.     width:250px;   
    22.     text-align:rightright;   
    23. }   
    24. #cwpad_box dd tt{   
    25.     width:20px;   
    26.     height:250px;   
    27.     top:0px;   
    28.     left:0px;   
    29.     color:#fff;   
    30.     cursor:pointer;   
    31.     text-align:center;   
    32.     padding:20px 0 0 0;   
    33.     background:#b9000d;   
    34.     position:absolute;   
    35.     border-right:1px solid #740a20;   
    36. }   
    37. #cwpad_box dd tt.hove{   
    38.     background:#620317;   
    39. }  

    在上面的樣式表中,假設(shè)放置的是四個250px*250px的圖片廣告,所以250+(4-1)*21=313px。

    2.javascript代碼

    1. <script type="text/javascript">   
    2. function myAddEvent(obj, sEvent, fn){   
    3.     return obj.attachEvent ? obj.attachEvent('on' + sEvent, fn) : obj.addEventListener(sEvent, fn, false);   
    4. }   
    5. function Class(oParent, sClass){   
    6.     var aElem = oParent.getElementsByTagName('*');   
    7.     var aClass = [];   
    8.     var i = 0;   
    9.     for(i=0;i<aElem.length;i++)if(aElem[i].className == sClass)aClass.push(aElem[i]);   
    10.     return aClass;   
    11. };   
    12. function css(obj, attr, value){   
    13.     if(arguments.length == 2){   
    14.         var style = obj.style,   
    15.             currentStyle = obj.currentStyle;   
    16.         if(typeof attr === 'string')return currentStyle ? currentStyle[attr] : getComputedStyle(obj, false)[attr];   
    17.         for(var propName in attr)propName == 'opacity' ? (style.filter = "alpha(opacity=" + attr[propName] + ")", style.opacity = attr[propName] / 100) : style[propName] = attr[propName];    
    18.     }else if(arguments.length == 3){   
    19.         switch(attr){   
    20.             case "width":   
    21.             case "height":   
    22.             case "paddingTop":   
    23.             case "paddingRight":   
    24.             case "paddingBottom":   
    25.             case "paddingLeft":   
    26.             case "top":   
    27.             case "right":   
    28.             case "bottom":   
    29.             case "left":   
    30.             case "marginTop":   
    31.             case "marginRigth":   
    32.             case "marginBottom":   
    33.             case "marginLeft":   
    34.                 obj.style[attr] = value + "px";   
    35.                 break;   
    36.             case "opacity":   
    37.                 obj.style.filter = "alpha(opacity=" + value + ")";   
    38.                 obj.style.opacity = value / 100;   
    39.                 break;   
    40.             default:   
    41.                 obj.style[attr] = value   
    42.         }   
    43.     }   
    44. };   
    45. function extend(destination, source){   
    46.     for (var propName in source) destination[propName] = source[propName];   
    47.     return destination   
    48. };   
    49. function doMove(obj, json, fnEnd){   
    50.     clearInterval(obj.timer);   
    51.     obj.iSpeed = 0;   
    52.     fnEnd = extend({   
    53.         type: "buffer",   
    54.         callback: function() {}   
    55.     }, fnEnd);   
    56.     obj.timer = setInterval(function(){   
    57.         var iCur = 0,   
    58.             iStop = true;   
    59.         for(var propName in json){   
    60.             iCur = parseFloat(css(obj, propName));   
    61.             propName == 'opacity' && (iCur = Math.round(iCur * 100));   
    62.             switch(fnEnd.type){   
    63.                 case 'buffer':   
    64.                     obj.iSpeed = (json[propName] - iCur) / 5;   
    65.                     obj.iSpeed = obj.iSpeed > 0 ? Math.ceil(obj.iSpeed) : Math.floor(obj.iSpeed);   
    66.                     json[propName] == iCur || (iStop = false, css(obj, propName, iCur + obj.iSpeed));   
    67.                     break;   
    68.                 case 'elasticity':   
    69.                     obj.iSpeed += (json[propName] - iCur) / 5;   
    70.                     obj.iSpeed *= 0.75;   
    71.                     Math.abs(json[propName] - iCur) <= 1 &&  Math.abs(obj.iSpeed) <= 1 ? css(obj, propName, json[propName]) : css(obj, propName, json[propName]) || (iStop = false, css(obj, propName, iCur + obj.iSpeed));   
    72.                     break;   
    73.                 case 'accelerate':   
    74.                     obj.iSpeed = obj.iSpeed + 5;   
    75.                     iCur >= json[propName] ? css(obj, propName, json[propName]) : css(obj, propName, json[propName]) || (iStop = false, css(obj, propName, iCur + obj.iSpeed));   
    76.                 break;   
    77.             }   
    78.         }   
    79.         if(iStop){   
    80.             clearInterval(obj.timer);   
    81.             obj.timer = null;   
    82.             obj.iSpeed = 0;   
    83.             fnEnd.callback();   
    84.         }   
    85.     },30);   
    86. };   
    87.   
    88. window.onload = function(){   
    89.     var oBox = document.getElementById('cwpad_box')   
    90.     var aSpan = document.getElementsByTagName('tt');   
    91.     var aLi = document.getElementsByTagName('dd');   
    92.     var playtime = null;   
    93.     var iNow = 0;   
    94.     for(i=0;i<aSpan.length;i++){   
    95.         aSpan[i].index = i;   
    96.         aSpan[i].onclick = function(){   
    97.             for(var len=aLi.length,i=0;i<len;i++)doMove(aLi[i], {width:21});   
    98.             for(var len=aSpan.length,i=0;i<len;i++)aSpan[i].className = '';   
    99.             this.className = 'hove';   
    100.             doMove(this.parentNode, {width:250});   
    101.             iNow = this.index;   
    102.         };   
    103.     }   
    104.     playtime = setInterval(tab,3500);   
    105.     oBox.onmouseover = function(){   
    106.         clearInterval(playtime);   
    107.     }   
    108.     oBox.onmouseout = function(){   
    109.         playtime = setInterval(tab,3500);   
    110.     }   
    111.     function tab(){   
    112.         iNow == aLi.length-1 ? iNow = 0 : iNow++;   
    113.         aSpan[iNow].onclick();   
    114.     }   
    115. };   
    116.  </script>    

     

    3.示例的HTML代碼

    1. <div id="cwpad_box">  
    2.     <ul>  
    3.         <dd  class="hove">  
    4.         <tt class="hove">網(wǎng)站設(shè)計及培訓(xùn)</tt>  
    5.         <a ></a>  
    6.         </dd>  
    7.     </ul>  
    8. </div>  

    使用的是索凌網(wǎng)絡(luò)前面介紹過的"假圖"生成網(wǎng)站fakeimg.pl生成的"假圖"。

    這組代碼的一個顯著缺點是:不適合移動設(shè)備顯示。

    posted @ 2014-01-08 11:20 cangshi 閱讀(262) | 評論 (0)編輯 收藏

    2014年1月6日 #

    1. if(is_admin())   

    2. {   

    3.     new Cool_Wp_List_Table();   

    4. }   

    5.   

    6. /**  

    7.  * Cool_Wp_List_Table class will create the page to load the table  

    8.  */  

    9. class Cool_Wp_List_Table   

    10. {   

    11.     /**  

    12.      * Constructor will create the menu item  

    13.      */  

    14.     public function __construct()   

    15.     {   

    16.         add_action( 'admin_menu', array($this, 'add_menu_example_list_table_page' ));   

    17.     }   

    18.   

    19.     /**  

    20.      * Menu item will allow us to load the page to display the table  

    21.      */  

    22.     public function add_menu_example_list_table_page()   

    23.     {   

    24.         add_menu_page( 'Coowp示例表格', 'Coowp示例表格', 'manage_options', 'coolwp-list-table.php', array($this, 'list_table_page') );   

    25.     }   

    26.   

    27.     /**  

    28.      * Display the list table page  

    29.      *  

    30.      * @return Void  

    31.      */  

    32.     public function list_table_page()   

    33.     {   

    34.         $exampleListTable = new Example_List_Table();   

    35.         $exampleListTable->prepare_items();   

    36.         ?>   

    37.             <div class="wrap">   

    38.                 <div id="icon-users" class="icon32"></div>   

    39.                 <h2>Coowp示例表格-頁面標(biāo)題</h2>   

    40.                 <?php $exampleListTable->display(); ?>   

    41.             </div>   

    42.         <?php   

    43.     }   

    44. }   

    45.   

    46. // WP_List_Table is not loaded automatically so we need to load it in our application   

    47. if( ! class_exists( 'WP_List_Table' ) ) {   

    48.     require_once( ABSPATH . 'wp-admin/includes/class-wp-list-table.php' );   

    49. }   

    50.   

    51. /**  

    52.  * Create a new table class that will extend the WP_List_Table  

    53.  */  

    54. class Example_List_Table extends WP_List_Table   

    55. {   

    56.     /**  

    57.      * Prepare the items for the table to process  

    58.      *  

    59.      * @return Void  

    60.      */  

    61.     public function prepare_items()   

    62.     {   

    63.         $columns = $this->get_columns();   

    64.         $hidden = $this->get_hidden_columns();   

    65.         $sortable = $this->get_sortable_columns();   

    66.   

    67.         $data = $this->table_data();   

    68.         usort( $data, array( &$this, 'sort_data' ) );   

    69.   

    70.         $perPage = 2;   

    71.         $currentPage = $this->get_pagenum();   

    72.         $totalItems = count($data);   

    73.   

    74.         $this->set_pagination_args( array(   

    75.             'total_items' => $totalItems,   

    76.             'per_page'    => $perPage  

    77.         ) );   

    78.   

    79.         $data = array_slice($data,(($currentPage-1)*$perPage),$perPage);   

    80.   

    81.         $this->_column_headers = array($columns, $hidden, $sortable);   

    82.         $this->items = $data;   

    83.     }   

    84.   

    85.     /**  

    86.      * Override the parent columns method. Defines the columns to use in your listing table  

    87.      *  

    88.      * @return Array  

    89.      */  

    90.     public function get_columns()   

    91.     {   

    92.         $columns = array(   

    93.             'id'          => __('ID'),   

    94.             'title'       => __('Title'),   

    95.             'description' => __('描述'),   

    96.             //__('Description'),怎么被Wordpress翻譯為“圖像描述”了?   

    97.             'date'        => __('Date'),   

    98.             'price'    => __('價格'),//__('Price'),   

    99.             'rating'      => __('Rating')   

    100.         );   

    101.   

    102.         return $columns;   

    103.     }   

    104.   

    105.     /**  

    106.      * Define which columns are hidden  

    107.      *  

    108.      * @return Array  

    109.      */  

    110.     public function get_hidden_columns()   

    111.     {   

    112.         return array();   

    113.     }   

    114.   

    115.     /**  

    116.      * Define the sortable columns  

    117.      *  

    118.      * @return Array  

    119.      */  

    120.     public function get_sortable_columns()   

    121.     {   

    122.         return array('title' => array('title', false));   

    123.     }   

    124.   

    125.     /**  

    126.      * Get the table data  

    127.      *  

    128.      * @return Array  

    129.      */  

    130.     private function table_data()   

    131.     {   

    132.         $data = array();   

    133.   

    134.         $data[] = array(   

    135.                     'id'          => 1,   

    136.                     'title'       => '某IT設(shè)備租賃公司:楊先生',   

    137.                     'description' => '上海,需求描述',   

    138.                     'date'        => '2013.01.01',   

    139.                     'price'       => '---',   

    140.                     'rating'      => '7.3'   

    141.                     );   

    142.   

    143.         $data[] = array(   

    144.                     'id'          => 2,   

    145.                     'title'       => '某婚攝團隊:李先生',   

    146.                     'description' => '臺灣,臺北',   

    147.                     'date'        => '2013.12.15',   

    148.                     'price'       => '---',   

    149.                     'rating'      => '7.2'   

    150.                     );   

    151.   

    152.         $data[] = array(   

    153.                     'id'          => 3,   

    154.                     'title'       => '在校研究生:梁小姐',   

    155.                     'description' => '墨爾本大學(xué):藝術(shù)設(shè)計',   

    156.                     'date'        => '2013.12.03',   

    157.                     'price'       => '---',   

    158.                     'rating'      => '7.0'   

    159.                     );   

    160.   

    161.         $data[] = array(   

    162.                     'id'          => 4,   

    163.                     'title'       => '某私人航空公司',   

    164.                     'description' => '僅前端交互:何小姐',   

    165.                     'date'        => '2014.01.01',   

    166.                      'price'      => '---',   

    167.                     'rating'      => '7.0'   

    168.                     );   

    169.         return $data;   

    170.     }   

    171.   

    172.     /**  

    173.      * Define what data to show on each column of the table  

    174.      *  

    175.      * @param  Array $item        Data  

    176.      * @param  String $column_name - Current column name  

    177.      *  

    178.      * @return Mixed  

    179.      */  

    180.     public function column_default( $item, $column_name )   

    181.     {   

    182.         switch( $column_name ) {   

    183.             case 'id':   

    184.             case 'title':   

    185.             case 'description':   

    186.             case 'date':   

    187.             case 'price':   

    188.             case 'rating':   

    189.                 return $item[ $column_name ];   

    190.   

    191.             default:   

    192.                 return print_r( $item, true ) ;   

    193.         }   

    194.     }   

    195.   

    196.     /**  

    197.      * Allows you to sort the data by the variables set in the $_GET  

    198.      *  

    199.      * @return Mixed  

    200.      */  

    201.     private function sort_data( $a, $b )   

    202.     {   

    203.         // Set defaults   

    204.         $orderby = 'title';   

    205.         $order = 'asc';   

    206.   

    207.         // If orderby is set, use this as the sort column   

    208.         if(!emptyempty($_GET['orderby']))   

    209.         {   

    210.             $orderby = $_GET['orderby'];   

    211.         }   

    212.   

    213.         // If order is set use this as the order   

    214.         if(!emptyempty($_GET['order']))   

    215.         {   

    216.             $order = $_GET['order'];   

    217.         }   

    218.   

    219.         $result = strcmp( $a[$orderby], $b[$orderby] );   

    220.   

    221.         if($order === 'asc')   

    222.         {   

    223.             return $result;   

    224.         }   

    225.   

    226.         return -$result;   

    227.     }   

    228. }  

    ENJOY IT!
    posted @ 2014-01-06 11:03 cangshi 閱讀(271) | 評論 (0)編輯 收藏

    2014年1月2日 #

    如果網(wǎng)頁包含大量圖片,那么,采用Lazyload來延遲圖片的載入以加速網(wǎng)頁整體在瀏覽器中的載入是個不錯的方法!

    上面這句話并不是翻譯來的,只是我想一句話說完。

    下面開始吧:

    1.在頁面頭部加載jQuery和這個Lazyload插件,如果已經(jīng)加載過了jQuery,那就不用再次加載了:

        <script src="http://upcdn.b0.upaiyun.com/libs/jquery/jquery-1.8.3.min.js" type="text/javascript"></script>   
        <script src="jquery.lazyload.js" type="text/javascript"></script>   

    是的,我習(xí)慣在國內(nèi)用又拍云的云加速。

    對圖片的處理:

        <img class="lazy" src="img/grey.gif" data-original="img/true_image.jpg"  width="730" heigh="300">   

    上面示例中的grey.gif實際上相當(dāng)于一個占位符,建議采用1*1px的灰色png或者gif,data-original后面的才是真正的圖片鏈接,class="lazy"是個可以定義的特定class。
    Lazyload基本設(shè)置

        <script type="text/javascript" charset="utf-8">   
            $(function() {   
                $("img.lazy").lazyload();   
            });   
        </script>  

    Lazyload基本設(shè)置的在線DEMO:Lazyload DEMO1
    對不支持js瀏覽器的處理

        <img class="lazy" src="img/grey.gif" data-original="img/true_image.jpg"  width="730" heigh="300">   
        <noscript><img src="img/true_image.jpg" width="730" heigh="300"></noscript>  

    用CSS隱藏占位符:

        .lazy {   
          display: none;   
        }  

    對支持js的瀏覽器,應(yīng)該在DOM準(zhǔn)備階段就初始化插件:

        $("img.lazy").show().lazyload();  

    當(dāng)然了,這樣處理兼容性更好,不過現(xiàn)在的瀏覽器大多都是支持js的。
    加載敏感度

    默認(rèn)的情況下,圖片將會在出現(xiàn)在屏幕上時顯示,如果想提載入圖片,可以使用 threshold 進行設(shè)置,下例的含義是:在圖片距離屏幕180px時提前載入:

        $("img.lazy").lazyload({ threshold :180});  

    占位圖片

    可以自定義一個簡單的淺色或灰色系的小圖片(越小越好,1*1px最佳,格式推薦采用gif)作為占位圖片來觸發(fā)加載動作。
    事件觸發(fā)

    可以是jQuery的任何事件(如click、mouseover),還可以使用自己定義的事件。

    例如:處于等待狀態(tài), 直到瀏覽者滾動到窗口中圖片所在位置,在占位圖片被點擊之前不加載圖片, 可以這樣做:

        $("img").lazyload({   
            placeholder : "img/grey.gif",   
            event : "click"  
        });  

     特效的使用

    當(dāng)圖片完全加載的時候,默認(rèn)使用show()方法來顯示圖片,所以,上面的那個基本設(shè)置示例中未寫出show(),但是可以照常運行。
     圖片淡入(FadeIn)效果

        $("img.lazy").lazyload({    
            effect : "fadeIn"  
        });  

    Lazyload圖片淡入效果演示
    將圖片放在特定容器中

    先看示例:水平滾動演示頁面和垂直滾動的演示頁面

    CSS部分示例

        #container {   
            height: 600px;   
            overflow: scroll;   
        }  

    js部分示例

        $("img.lazy").lazyload({            
             container: $("#container")   
        });  

     圖片未按順序排列的情況

    滾動頁面的時候,Lazyload會按照在HTML代碼中的順序先后可視范圍內(nèi)的加載圖片,在第一張不在可視范圍內(nèi)的圖片處停止執(zhí)行,但是在某些頁面布局中,這種聰明的假設(shè)可能是不成立的,那么可以用failurelimit來控制加載動作:

        $("img.lazy").lazyload({    
            failure_limit : 10   
        });  

    上面的意思是:在找到10張不在可視范圍內(nèi)的圖片時停止執(zhí)行。額,好吧,如果你的頁面布局猥瑣到10不足以滿足的時候,那就再大一些吧。
    Lazyload定時延遲圖片載入

    Lazyload的一個并不完備的功能,并不影響使用,但是實際用途并不大!用途描述:在頁面和可見圖片載入后一定時間內(nèi)載入圖片。Lazyload定時延遲圖片載入示例

        $(function() {             
            $("img:below-the-fold").lazyload({   
                event : "sporty"  
            });   
        });   
        $(window).bind("load", function() {    
            var timeout = setTimeout(function() {$("img.lazy").trigger("sporty")}, 5000);   
        });  

    上例中采用的參數(shù)或者說定時是5秒。
     加載隱藏的圖片

    你的頁面上可能隱藏了很多不可見的圖片用作特殊用途,Lazyload默認(rèn)是忽略這些圖片的,如果不想忽略掉,可以這樣:

        $("img.lazy").lazyload({    
            skip_invisible : false   
        });  

     
     Lazyload下載與兼容性

    最新的未壓縮版 source與壓縮版 minified。

    你看到這篇文章時可能有更新的版本了,請點擊Lazyload了解更多!

    兼容于:

    OSX平臺: Safari 5.1, Safari 6, Chrome 20, Firefox 12

    WIN平臺:Chrome 20, IE 8 and IE 9 on Windows

    iPhone和 iPad上:Safari 5.1
    posted @ 2014-01-02 11:16 cangshi 閱讀(7701) | 評論 (1)編輯 收藏

    2013年12月31日 #

    本文介紹一組適用于在Wordpress側(cè)欄放置的圖片廣告輪播(js)代碼:可自動播放,同時響應(yīng)訪客的點擊

    1.樣式表

    1. /*SidebarTabsAd*/  
    2. #cwpad_box{width:100%;text-align:center}   
    3. #cwpad_box ul, #cwpad_box dd, #cwpad_box tt{   
    4.     margin:0px;   
    5.     padding:0px;   
    6.     float:left;   
    7.     list-style: none;   
    8. }   
    9. #cwpad_box{   
    10.     width:313px;/*250px+(n-1)*21px*/  
    11.     height:250px;   
    12.     border-left: 1px solid #740a20;   
    13. }   
    14. #cwpad_box dd{   
    15.     width:21px;   
    16.     height:250px;   
    17.     overflow:hidden;   
    18.     position:relative;   
    19. }   
    20. #cwpad_box dd.hove{   
    21.     width:250px;   
    22.     text-align:rightright;   
    23. }   
    24. #cwpad_box dd tt{   
    25.     width:20px;   
    26.     height:250px;   
    27.     top:0px;   
    28.     left:0px;   
    29.     color:#fff;   
    30.     cursor:pointer;   
    31.     text-align:center;   
    32.     padding:20px 0 0 0;   
    33.     background:#b9000d;   
    34.     position:absolute;   
    35.     border-right:1px solid #740a20;   
    36. }   
    37. #cwpad_box dd tt.hove{   
    38.     background:#620317;   
    39. }  

    在上面的樣式表中,假設(shè)放置的是四個250px*250px的圖片廣告,所以250+(4-1)*21=313px。

    2.javascript代碼

    1. <script type="text/javascript">   
    2. function myAddEvent(obj, sEvent, fn){   
    3.     return obj.attachEvent ? obj.attachEvent('on' + sEvent, fn) : obj.addEventListener(sEvent, fn, false);   
    4. }   
    5. function Class(oParent, sClass){   
    6.     var aElem = oParent.getElementsByTagName('*');   
    7.     var aClass = [];   
    8.     var i = 0;   
    9.     for(i=0;i<aElem.length;i++)if(aElem[i].className == sClass)aClass.push(aElem[i]);   
    10.     return aClass;   
    11. };   
    12. function css(obj, attr, value){   
    13.     if(arguments.length == 2){   
    14.         var style = obj.style,   
    15.             currentStyle = obj.currentStyle;   
    16.         if(typeof attr === 'string')return currentStyle ? currentStyle[attr] : getComputedStyle(obj, false)[attr];   
    17.         for(var propName in attr)propName == 'opacity' ? (style.filter = "alpha(opacity=" + attr[propName] + ")", style.opacity = attr[propName] / 100) : style[propName] = attr[propName];    
    18.     }else if(arguments.length == 3){   
    19.         switch(attr){   
    20.             case "width":   
    21.             case "height":   
    22.             case "paddingTop":   
    23.             case "paddingRight":   
    24.             case "paddingBottom":   
    25.             case "paddingLeft":   
    26.             case "top":   
    27.             case "right":   
    28.             case "bottom":   
    29.             case "left":   
    30.             case "marginTop":   
    31.             case "marginRigth":   
    32.             case "marginBottom":   
    33.             case "marginLeft":   
    34.                 obj.style[attr] = value + "px";   
    35.                 break;   
    36.             case "opacity":   
    37.                 obj.style.filter = "alpha(opacity=" + value + ")";   
    38.                 obj.style.opacity = value / 100;   
    39.                 break;   
    40.             default:   
    41.                 obj.style[attr] = value   
    42.         }   
    43.     }   
    44. };   
    45. function extend(destination, source){   
    46.     for (var propName in source) destination[propName] = source[propName];   
    47.     return destination   
    48. };   
    49. function doMove(obj, json, fnEnd){   
    50.     clearInterval(obj.timer);   
    51.     obj.iSpeed = 0;   
    52.     fnEnd = extend({   
    53.         type: "buffer",   
    54.         callback: function() {}   
    55.     }, fnEnd);   
    56.     obj.timer = setInterval(function(){   
    57.         var iCur = 0,   
    58.             iStop = true;   
    59.         for(var propName in json){   
    60.             iCur = parseFloat(css(obj, propName));   
    61.             propName == 'opacity' && (iCur = Math.round(iCur * 100));   
    62.             switch(fnEnd.type){   
    63.                 case 'buffer':   
    64.                     obj.iSpeed = (json[propName] - iCur) / 5;   
    65.                     obj.iSpeed = obj.iSpeed > 0 ? Math.ceil(obj.iSpeed) : Math.floor(obj.iSpeed);   
    66.                     json[propName] == iCur || (iStop = false, css(obj, propName, iCur + obj.iSpeed));   
    67.                     break;   
    68.                 case 'elasticity':   
    69.                     obj.iSpeed += (json[propName] - iCur) / 5;   
    70.                     obj.iSpeed *= 0.75;   
    71.                     Math.abs(json[propName] - iCur) <= 1 &&  Math.abs(obj.iSpeed) <= 1 ? css(obj, propName, json[propName]) : css(obj, propName, json[propName]) || (iStop = false, css(obj, propName, iCur + obj.iSpeed));   
    72.                     break;   
    73.                 case 'accelerate':   
    74.                     obj.iSpeed = obj.iSpeed + 5;   
    75.                     iCur >= json[propName] ? css(obj, propName, json[propName]) : css(obj, propName, json[propName]) || (iStop = false, css(obj, propName, iCur + obj.iSpeed));   
    76.                 break;   
    77.             }   
    78.         }   
    79.         if(iStop){   
    80.             clearInterval(obj.timer);   
    81.             obj.timer = null;   
    82.             obj.iSpeed = 0;   
    83.             fnEnd.callback();   
    84.         }   
    85.     },30);   
    86. };   
    87.   
    88. window.onload = function(){   
    89.     var oBox = document.getElementById('cwpad_box')   
    90.     var aSpan = document.getElementsByTagName('tt');   
    91.     var aLi = document.getElementsByTagName('dd');   
    92.     var playtime = null;   
    93.     var iNow = 0;   
    94.     for(i=0;i<aSpan.length;i++){   
    95.         aSpan[i].index = i;   
    96.         aSpan[i].onclick = function(){   
    97.             for(var len=aLi.length,i=0;i<len;i++)doMove(aLi[i], {width:21});   
    98.             for(var len=aSpan.length,i=0;i<len;i++)aSpan[i].className = '';   
    99.             this.className = 'hove';   
    100.             doMove(this.parentNode, {width:250});   
    101.             iNow = this.index;   
    102.         };   
    103.     }   
    104.     playtime = setInterval(tab,3500);   
    105.     oBox.onmouseover = function(){   
    106.         clearInterval(playtime);   
    107.     }   
    108.     oBox.onmouseout = function(){   
    109.         playtime = setInterval(tab,3500);   
    110.     }   
    111.     function tab(){   
    112.         iNow == aLi.length-1 ? iNow = 0 : iNow++;   
    113.         aSpan[iNow].onclick();   
    114.     }   
    115. };   
    116.  </script>    

     

    3.示例的HTML代碼

    1. <div id="cwpad_box">  
    2.     <ul>  
    3.         <dd  class="hove">  
    4.         <tt class="hove">網(wǎng)站設(shè)計及培訓(xùn)</tt>  
    5.         <a ></a>  
    6.         </dd>  
    7.     </ul>  
    8. </div>  

    使用的是索凌網(wǎng)絡(luò)前面介紹過的"假圖"生成網(wǎng)站fakeimg.pl生成的"假圖"。

    這組代碼的一個顯著缺點是:不適合移動設(shè)備顯示。

    posted @ 2013-12-31 11:30 cangshi 閱讀(291) | 評論 (0)編輯 收藏

    2013年12月5日 #

    本文詳細介紹了如何查詢Wordpress某一篇文章作者的文章以及其權(quán)限,附帶介紹了Wordpress的用戶權(quán)限系統(tǒng),指出了網(wǎng)上到處復(fù)制的某些文章存在的問題。

    一、查詢Wordpress某篇文章作者的全部文章或部分最新文章

    1.獲取當(dāng)前文章作者的ID

    1. get_post($id)->post_author  

    這才是獲取Wordpress當(dāng)前文章作者ID的正確方式,網(wǎng)上到處亂傳的那篇名叫“WordPress 通過文章ID獲取文章標(biāo)題、內(nèi)容等信息”的文章里的說法是錯誤的,雖然是錯誤的,但是卻被廣泛的Ctrl+C然后Ctrl+V,以訛傳訛,不可思議啊。

    另外get_post($id)->可以獲取與文章有關(guān)的許多信息,轉(zhuǎn)述如下:

    1. post_author:(整數(shù))文章作者的編號    
    2. post_data:(字符)文章發(fā)表的日期和時間(YYYY-MM-DD HH-MM-SS)    
    3. post_data_gmt:(字符)文章發(fā)表的格林尼治標(biāo)準(zhǔn)時間(GMT) (YYYY-MM-DD HH-MM-SS)    
    4. post_content:(字符)文章內(nèi)容    
    5. post_title:(字符)文章標(biāo)題    
    6. post_category:(整數(shù))文章類別的編號。注意:該值在WordPress 2.1之后的版本總為0。定義文章的類別時可使用 get_the_category()函數(shù)。    
    7. post_excerpt:(字符)文章摘要    
    8. post_status:(字符)文章狀態(tài)(publish|pending|draft|private|static|object|attachment|inherit|future)    
    9. comment_status:(字符)評論狀態(tài)(open|closed|registered_only)    
    10. ping_status:(字符)pingback/trackback狀態(tài)(open|closed)    
    11. post_password:(字符)文章密碼    
    12. post_name:(字符)文章的URL嵌套    
    13. to_ping:(字符)要引用的URL鏈接    
    14. pinged:(字符)引用過的鏈接    
    15. post_modified:(字符)文章最后修改時間(YYYY-MM-DD HH-MM-SS)    
    16. post_modified_gmt:(字符)文章最后修改GMT時間(YYYY-MM-DD HH-MM-SS)    
    17. post_parent:(整數(shù))父級文章編號(供附件等)    
    18. guid:(字符)文章的一個鏈接。注意:不能將GUID作為永久鏈接(雖然在2.5之前的版本中它的確被當(dāng)作永久鏈接),也不能將它作為文章的可用鏈接。GUID是一種獨有的標(biāo)識符,只是目前恰巧成為文章的一個鏈接。    
    19. post_type:(字符)(日志 | 頁面 | 附件)    
    20. post_mime_type:(字符)Mime類型(供附件等)    
    21. comment_count:(整數(shù))評論總數(shù)  

     

    2.Wordpress查詢文章作者的全部文章/部分文章的主要函數(shù)及輸出

    1. <?php   
    2. global $wpdb;   
    3. //$current_user->ID的話,查詢的就是當(dāng)前登錄的用戶,所以是不對的;   
    4. $author_id = get_post($id)->post_author;   
    5. $sql =  "SELECT * FROM $wpdb->posts WHERE post_status IN ('publish','static') AND post_author = '$author_id' AND post_type ='post'LIMIT 5" ; //查詢作者文章數(shù)量   
    6. $posts= $wpdb->get_results($sql);   
    7.     foreach ($posts as $post) {   
    8.   
    9. echo'<li><a href="';the_permalink();echo '" rel="twipsy" title="';the_title();echo '">'. mb_strimwidth(get_the_title(), 0, 20,"...").'</a></li>';   
    10. }   
    11. ?>  

    只在無序列表ul里輸出一個列表,格式是截斷的標(biāo)題加上鏈接,查詢了僅僅5篇,多了的話,沒什么用,這里僅僅是測試。

    二、Wordpress用戶角色與權(quán)限

    WordPress用戶角色或者Wordpress用戶權(quán)限說是從Wordpress2.0開始,逐漸的完善起來的,默認(rèn)分以下幾種的:

    1. Super Admin超級管理員-針對Wordpress多站點環(huán)境,一般人很少接觸,所以很少有人提及;   
    2. Administrator管理員 -擁有特定的某一個站點的所有管理權(quán)限;   
    3. Editor編輯 -發(fā)表文章、編輯文章、并能編輯其他人的文章等等;   
    4. Author作者-能夠發(fā)布和編輯自己的文章;   
    5. Contributor貢獻者或者叫投稿者 -能夠撰寫和編輯自己的文章、但不能發(fā)布;   
    6. Subscriber訂閱者 -能夠查看評論/添加評論/查看文章,等等。  

     

    當(dāng)新用戶在你的Wordpress站點上注冊了的時候(假設(shè)已經(jīng)開啟注冊),他的默認(rèn)角色可以在Wordpress后臺-->設(shè)置-->常規(guī)頁面設(shè)置。

    下面的用戶角色以及對應(yīng)的權(quán)限能力等級對照表翻譯自Wordpress官方網(wǎng)站,所在頁面:

    http://codex.wordpress.org/Roles_and_Capabilities#Capabilities

     

    角色超級管理員管理員(單個站點)編輯作者貢獻者(投稿者)訂閱者
    manage_network




    manage_sites




    manage_network_users




    manage_network_plugins




    manage_network_themes




    manage_network_options




    unfiltered_html




    角色超級管理員管理員(單個站點)編輯作者貢獻者(投稿者)訂閱者
    activate_plugins



    create_users僅單個站點



    delete_plugins



    delete_themes僅單個站點



    delete_users



    edit_files



    edit_plugins僅單個站點



    edit_theme_options



    edit_themes僅單個站點



    edit_users僅單個站點



    export



    import



    角色超級管理員管理員(單個站點)編輯作者貢獻者(投稿者)訂閱者
    install_plugins僅單個站點



    install_themes僅單個站點



    list_users



    manage_options



    promote_users



    remove_users



    switch_themes



    update_core僅單個站點



    update_plugins僅單個站點



    update_themes僅單個站點



    edit_dashboard



    角色超級管理員管理員(單個站點)編輯作者貢獻者(投稿者)訂閱者
    moderate_comments


    manage_categories


    manage_links


    edit_others_posts


    edit_pages


    edit_others_pages


    edit_published_pages


    publish_pages


    delete_pages


    delete_others_pages


    delete_published_pages


    delete_others_posts


    delete_private_posts


    edit_private_posts


    閱讀_private_posts


    delete_private_pages


    edit_private_pages


    閱讀_private_pages


    角色超級管理員管理員(單個站點)編輯作者貢獻者(投稿者)訂閱者
    edit_published_posts

    upload_files

    create_product

    publish_posts

    delete_published_posts

    edit_posts
    delete_posts
    閱讀
    角色超級管理員管理員(單個站點)編輯作者貢獻者(投稿者)訂閱者

     

    1.查詢Wordpress文章作者的角色

    在本文的開頭,我們已經(jīng)知道如何獲取Wordpress某一篇文章的作者ID了,現(xiàn)在就來獲取其角色:

    1. $user_id=get_post($id)->post_author;   
    2. if(user_can($user_id,'install_plugins')){echo'管理員';}   
    3. elseif(user_can($user_id,'edit_others_posts')){echo'管理編輯';}elseif(user_can($user_id,'publish_posts')){echo'作者';}elseif(user_can($user_id,'delete_posts')){echo'貢獻者';}elseif(user_can($user_id,'read')){echo'訂閱者';}   

    管理員和編輯都能publish_posts,但是這里的判斷有先后順序,所以不用擔(dān)心這個問題,這個判斷是不錯的!

    WordPress某篇文章的作者是否有某權(quán)限的推薦函數(shù)

    1. if ( author_can( $post, $capability ) ) {      
    2. // 如果文章 $post 的作者擁有 $capability 時執(zhí)行的動作      
    3. }    

    這個相對簡單一些,可以直接去判斷,所以我再某個項目中最終使用了這個函數(shù)。參數(shù)中的$post可以是文章自身,也可以是文章ID,使用起來很方便!

    1. if(author_can($post->ID,'install_plugins'))   
    2. {echo'<span class="label label-warning role">管理員</span>';}elseif(author_can($post->ID,'edit_others_posts')){echo'管理編輯';}elseif(author_can($post->ID,'publish_posts')){echo'作者';}elseif(author_can($post->ID,'delete_posts')){echo'投稿者';}elseif(author_can($post->ID,'read')){echo'訂閱者';}  

    2.Wordpress當(dāng)前登錄者的權(quán)限/權(quán)限等級

    這個函數(shù)是經(jīng)常被使用的,使用的是權(quán)限等級,Wordpress官方已經(jīng)聲明:從Wordpress3.0,已經(jīng)廢棄了對這個權(quán)限等級制度的支持,所以,網(wǎng)上到處亂飛的復(fù)制文章,謹(jǐn)慎對待吧!

    1. <?php if(current_user_can('level_10')){ echo '管理員';}elseif(current_user_can('level_7')){ echo '管理編輯';}elseif(current_user_can('level_4')){ echo '作者';}elseif(current_user_can('level_4')){ echo '貢獻者';}elseif(current_user_can('level_0')){ echo '訂閱者';}   
    2.     ?>  

     

    posted @ 2013-12-05 10:49 cangshi 閱讀(2428) | 評論 (0)編輯 收藏

    2013年11月20日 #

    平時思想工作考慮問題倒是蠻周全的,我現(xiàn)在最大的難處就是經(jīng)濟條件太差了,想做點什么事情總是縮手縮腳的,就好像是被束縛一樣。不過我感覺像現(xiàn)在這樣其實也蠻好和合適的。最無奈的事情是我接了別人的爛攤子導(dǎo)致我沒有為老大做出什么特殊的貢獻吧,既然現(xiàn)在要從頭開始了,那么一定要好好的規(guī)劃好一切,先把開頭做好一點,后面才會有下文要不然可以的話我的路線就到頭了。真正算起來的黃金時間確實就是那么一點點,如果說再不好好利用,那真的是對不起這個行業(yè)的理解力了。有時候可以就是這樣,百分之二十的時間確實可以產(chǎn)生百分之八十的效率這就看你會不會時間管理工作。把一些細節(jié)發(fā)揮到極致每天就可以非常的輕松的。我只不過是還沒有達到那個境界或者說沒有機會好好展示自己價值的平臺吧,有時候真的覺得英雄會不會是沒有用武之地了呢。不用擔(dān)心多一點耐心多點積累,事情總是會出現(xiàn)轉(zhuǎn)機的,繼續(xù)保持穩(wěn)定的正常的工作面能力圖文混排就行了。老白最后肯定是會看好你的,因為現(xiàn)在心急已經(jīng)沒有立足之地了。
    posted @ 2013-11-20 11:32 cangshi 閱讀(184) | 評論 (0)編輯 收藏

    2013年10月18日 #

    一轉(zhuǎn)眼,國慶一放假又有幾天的融合期間,所以一下子半個月很快就過去了我竟然一篇目信息都沒有發(fā)表,這著實是有點讓人難以置信的現(xiàn)象特別是想要討好老白的情況匯報下。這種現(xiàn)象是不能容忍的。本來對策我是想過要多對一模式又不能太多,關(guān)鍵詞太多,又分配不公,操作不好又被放到人為操作的可能性了,我目前的善哉只能是權(quán)宜之計,好讓我爭取一點點時間,希望這一個月里能夠有點睛之筆吧無論如何我都已經(jīng)是我的大局了。一個鏈接也能夠發(fā)接力賽作用,老大對我有點不相信能力只是感嘆能夠證明我的時間監(jiān)察部實在是太短了,跟一年兩年才更新?lián)Q代的老白,三個月算什么呢?根本就是九牛一毛吧很不經(jīng)意的一點信息說不定就事論事。沒有什么是絕對真理和公平競爭的,當(dāng)前情況下做不起的事情實在是太多了,不管生效與否,先做了再說嘛畢竟這是最自然的方式了驗收后再做流行度其實倒是還可以的,沒有利用一下就被否定了,結(jié)果是很不甘心情愿。
    posted @ 2013-10-18 17:07 cangshi 閱讀(172) | 評論 (0)編輯 收藏

    2013年9月27日 #

    其實之前早就存在這樣一個問題,只是沒有時間去考慮是否會影響到整個網(wǎng)站結(jié)構(gòu)的內(nèi)部優(yōu)化。忙里偷閑之中我無意找到了解決方案在網(wǎng)上找到的,程序是PHP的,在這里轉(zhuǎn)載分享一下,也希望在以后能夠利用方便一點。

    首先設(shè)置.htaccess文件,將動態(tài)調(diào)用的參數(shù)轉(zhuǎn)換為靜態(tài)的HTML的URL地址,例如將在post目錄下的文件,轉(zhuǎn)發(fā)到根目錄的wp- post.php文件中,加入的語句類似:RewriteRule ^post/([a-z0-9\-]+\.html)$ wp-post.php?$1$2

    然后修改wp-post.php文件,在文件的開頭加入以下PHP代碼:

    以下為引用的內(nèi)容:

    ob_start();

    $qstring = isset($_SERVER["QUERY_STRING"]) ? $_SERVER["QUERY_STRING"] : "";

    define("HTML_FILE", $_SERVER['DOCUMENT_ROOT']."/post/".$qstring);

    if (file_exists(HTML_FILE))

    {

    $lcft = filemtime(HTML_FILE);

    if (($lcft + 3600) > time()) //判斷上次生成HTML文件是否超過1小時,若沒有才直接輸出文件內(nèi)容

    {

    echo(file_get_contents(HTML_FILE));

    exit(0);

    }

    }

    之后是現(xiàn)有的PHP的代碼,然后在當(dāng)前代碼的最后面加上如下的PHP代碼:

    以下為引用的內(nèi)容:

    define("HTMLMETA","");

    $buffer = ob_get_flush();

    $fp = fopen(HTML_FILE, "w");

    if ($fp)

    {

    fwrite($fp, $buffer.HTMLMETA);

    fclose($fp);

    }

    好了,然后查看你的靜態(tài)HTML頁面,如果頁面尾部出現(xiàn)了注釋行,說明已經(jīng)成功的創(chuàng)建了靜態(tài)HTML文件。

    這個方法的一個應(yīng)用就是我先前寫的那個“WordPress年度博客統(tǒng)計插件”,這個統(tǒng)計插件由于查詢十多次數(shù)據(jù)庫,很多人訪問的時候會有很大性能問題,使用我介紹的這種動態(tài)生成HTML技術(shù)后,一天就查詢一次,生成一次統(tǒng)計排行,完美解決了查詢數(shù)據(jù)庫的性能問題。

    posted @ 2013-09-27 11:14 cangshi 閱讀(173) | 評論 (0)編輯 收藏

    2013年9月26日 #

    也不知道為什么,在我的心理上對待事情我老是想要做公平主義和平均主義,為此我也付出了不小的代價我在想為什么不改變一下方向呢。就是像先人鄧小平一樣先富一部分人,然后先富帶動后富。也許我應(yīng)該就是明白這個道理,世界上沒有絕對的公平和平均,那些都是直撥虛擬的東西,每個個人的實際情況都是不一樣。每個人的境遇和背景也不一樣,絕對不能放到同樣一個水平面上相提并論有些規(guī)則雖然說起來不那么好聽但是卻是千古不變的真理,天下也沒有絕對公平和平均。這樣的想法純熟是簡單的個人意愿而已并且已經(jīng)落后很多年了,有這樣的想法也只能說明沒有創(chuàng)新紀(jì)錄意識形態(tài)糾正以后才會慢慢發(fā)現(xiàn)這個世界不是只有白與黑,而絕大區(qū)域都是灰色地帶。如果說還不能習(xí)慣這樣的潛規(guī)則那么以后要慢慢適應(yīng)性了,不去適應(yīng)環(huán)境的人遲早是要被這個社會所淘汰掉的。你想做什么樣的人中,你想成為什么樣的人呢?
    posted @ 2013-09-26 11:01 cangshi 閱讀(135) | 評論 (0)編輯 收藏

    主站蜘蛛池模板: 亚洲精品老司机在线观看| 美女被免费网站在线视频免费| 俄罗斯极品美女毛片免费播放| 亚洲一区免费观看| 一区二区三区免费电影| 亚洲jizzjizz少妇| 亚洲免费中文字幕| 久久久无码精品亚洲日韩京东传媒| 2048亚洲精品国产| 全黄a免费一级毛片人人爱| 99视频在线精品免费观看6| 亚洲最大免费视频网| 久久午夜无码免费| 免费看黄的成人APP| 国产精品午夜免费观看网站| 国产偷国产偷亚洲高清在线| 亚洲欧美自偷自拍另类视| 亚洲一区二区三区高清不卡| 精品日韩99亚洲的在线发布| 亚洲影视一区二区| 亚洲神级电影国语版| 亚洲欧洲精品一区二区三区| 久久综合亚洲色一区二区三区| 亚洲精品国产成人99久久| 久久久久亚洲av无码尤物| 亚洲国产精品福利片在线观看| 亚洲精品无码乱码成人| 亚洲色自偷自拍另类小说| 亚洲精品蜜桃久久久久久| 亚洲va无码va在线va天堂| 亚洲人成在线影院| 亚洲成人黄色网址| 国产成人精品日本亚洲11| 亚洲男人的天堂网站| 国产亚洲视频在线观看| 无码精品人妻一区二区三区免费 | 国产黄色片免费看| 九九全国免费视频| 国产伦精品一区二区免费| 成人无码区免费A∨直播| 日韩精品无码免费专区网站|