使用shake.js讓你博客支持搖一搖


大家好,又到了隨機文章的時間,請使用手機打開演示站點,然后像搖妹子一樣搖晃手機,你會發現非常牛逼的事情,炫酷吧。該功能已經集成在Oconnor1.8中。本文主要講解這貨的原理。
首先需要下載shake.js,shake.js github地址,我們只需要里面的shake.js,然后引入。
添加“搖一搖”事件監聽
window.addEventListener('shake', shakeEventDidOccur, false);

//function to call when shake occurs
function shakeEventDidOccur () {

    //put your own code here etc.
    if (confirm("Undo?")) {

    }
}
取消監聽
window.removeEventListener('shake', shakeEventDidOccur, false);
隨機文章實現方式
JS代碼,當然在這之前需要進入shake.js腳本
window.addEventListener('shake', shakeEventDidOccur, false);

//function to call when shake occurs
function shakeEventDidOccur () {

    jQuery.post(Bigfa.ajaxurl, {
                action : 'random_post',
                }, function(data) {
                    window.location.href = data;
            });
}
下面的代碼扔到functions.php中,如果你已經添加了上一篇隨機文章的代碼這里就不需要
wp_enqueue_script( 'key', true);
wp_localize_script('key', 'Bigfa', array(
     "ajaxurl" => admin_url('admin-ajax.php')
));
add_action( 'wp_ajax_random_post', 'bigfa_random_post' );
add_action( 'wp_ajax_nopriv_random_post', 'bigfa_random_post' );
function bigfa_random_post() {
    $posts = get_posts('post_type=post&orderby=rand&numberposts=1');
    foreach($posts as $post) {
        $link = get_permalink($post);
    }
    echo $link;
    exit;
}
OK。just 搖 it。
瀏覽器和設備支持情況
iOS Safari 4.2.1 (and above)
Android 4.0.3 (default browser)
Opera Mobile (Android)
BlackBerry PlayBook 2.0
Firefox for Android
FirefoxOS Devices

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM