Jquery设置鼠标移动到图片上面实现放大效果
2020-11-18 08:44:53
//设置原点为右上角
$('#book_img').css("-moz-transform-origin","top right");
$('#book_img').css("-webkit-transform-origin","top right");
$('#book_img').css("-ms-transform-origin","top right");
$('#book_img').css("-o-transform-origin","top right");
$('#book_img').hover(function() {$(this).css("transform","scale(1.5)");$(this).css("-moz-transform","scale(1.5)");$(this).css("-webkit-transform","scale(1.5)");$(this).css("-ms-transform","scale(1.5)");},function(){$(this).css("transform","scale(1)");$(this).css("-moz-transform","scale(1)");$(this).css("-webkit-transform","scale(1)");$(this).css("-ms-transform","scale(1)");})
//鼠标移入和移出设置css样式
$('#book_img').css("transition","all 0.3s");
$('#book_img').css("-moz-transform-origin","top right");
$('#book_img').css("-webkit-transform-origin","top right");
$('#book_img').css("-ms-transform-origin","top right");
$('#book_img').css("-o-transform-origin","top right");
$('#book_img').hover(function() {$(this).css("transform","scale(1.5)");$(this).css("-moz-transform","scale(1.5)");$(this).css("-webkit-transform","scale(1.5)");$(this).css("-ms-transform","scale(1.5)");},function(){$(this).css("transform","scale(1)");$(this).css("-moz-transform","scale(1)");$(this).css("-webkit-transform","scale(1)");$(this).css("-ms-transform","scale(1)");})
//鼠标移入和移出设置css样式
$('#book_img').css("transition","all 0.3s");