jQuery實作3D文字特效的方法_jquery

本文實例講述了jQuery實作3D文字特效的方法。分享給大家供大家參考。具體如下：

這款基於jQuery的3D文字特效演示，不是真正的3D，是由多個文字形成的3D效果，如果首次加載網頁出錯的話，請刷新頁面，當然在使用中不會出現此問題。

複製程式碼 程式碼如下:

   

 
• ajax

 
• css

 
• design

 
• firefox

 
• flash

 
• html

 
• Devirtuoso

 
• jquery

 
• PHP

 
• SEO

 
• usability

 
• www

 
• web

 
• xhtml

   

$(文檔).ready(function(){
    var element = $('#list a');;
    變數偏移量=0；
    var 步進 = 0.03;
    var list = $('#list');
    var $list = $(list)
    $list.mousemove(函數(e){
        var topOfList = $list.eq(0).offset().top
        var listHeight = $list.height()
        步進 = (e.clientY - topOfList) /  listHeight * 0.2 - 0.1;
    });
    for (var i = element.length - 1; i >= 0; i--)
    {
        element[i].elemAngle = i * Math.PI * 2 / element.length;
    }
    setInterval(渲染, 20);
函數渲染（）{
        for (var i = element.length - 1; i >= 0; i--){
            var angle = element[i].elemAngle offset;
            x = 120 Math.sin(角度) * 30;
            y = 45 Math.cos(角) * 40;
            大小 = Math.round(40 - Math.sin(角度) * 40);
            var elementCenter = $(element[i]).width() / 2;
            var leftValue = (($list.width()/2) * x / 100 - elementCenter) "px"
            $(element[i]).css("fontSize", size "pt");
            $(element[i]).css("不透明度",size/100);
            $(element[i]).css("zIndex" ,size);
            $(element[i]).css("left" ,leftValue);
            $(element[i]).css("top", y "%");
        }
        偏移=步進；
    }
});
腳本>
身體>