色婷婷狠狠18禁久久YY,CHINESE性内射高清国产,国产女人18毛片水真多1,国产AV在线观看

jquery3d懸浮字體

傅智翔1年前8瀏覽0評論

jQuery 3D懸浮字體是前端常見的一個效果,它涉及到CSS3的三維變換,可以為網頁設計帶來炫酷的視覺效果。可以使用jQuery和CSS3實現3D懸浮字體。下面是一個示例:

$('.box').on('mousemove', function(e){
var w = $(this).width(),
h = $(this).height(),
x = e.pageX - $(this).offset().left - w / 2,
y = e.pageY - $(this).offset().top - h / 2;
var r = Math.sqrt(Math.pow(x, 2) + Math.pow(y, 2)),
angle = Math.atan2(y, x),
tiltAngle = angle * (180 / Math.PI),
dy = e.pageY - $(this).offset().top,
dx = e.pageX - $(this).offset().left,
rz = dx - w / 2;
$(this).find('.text').css({
transform: 'rotateY(' + tiltAngle + 'deg)' + 'rotateX(' + (-3 * (dy / h)) + 'deg)' + 'translateZ(40px)' + 'translateX(' + (-30 + 30 * (dx / w)) + 'px)',
'-webkit-transform': 'rotateY(' + tiltAngle + 'deg)' + 'rotateX(' + (-3 * (dy / h)) + 'deg)' + 'translateZ(40px)' + 'translateX(' + (-30 + 30 * (dx / w)) + 'px)'
});
});

這段代碼實現了鼠標在文本框上移動時,文本框內的文字可以傾斜、旋轉、平移,從而呈現3D的效果。