我有动态生成的图像,需要在鼠标悬停时缩小/放大。
我尝试了以下方式,
.thumbnail_img img:hover
{
-webkit-transform: scale(1.5);
-moz-transform: scale(1.5);
-o-transform: scale(1.5);
-ms-transform: scale(1.5);
transform: scale(1.5);
}
但它只是缩放图像,图像变得模糊。
也尝试了以下方式,
$('#' + '<%=dntbuddata.ClientID%>').hover(function () {
$(this).css({ width: "430px", height: "434px" });
}, function () {
$(this).css({ width: "130", height: "134%" });
});
}
以上方式也可以缩放图像甚至UI分布。
如果图像ZOOM OUT inpopup对话框并且不模糊,那将会很棒。
由于所有图像都是动态生成的,因此我无法创建两个副本,并在鼠标悬停时切换它们。
更新
现在,我能够解决以下称为建议的图像模糊问题。现在,如何将此图像打开到弹出对话框(禁用/黑色背景)?
if ($('#' + '<%=dntbudget.ClientID%>')) {
$('#' + '<%=dntbudget.ClientID%>').css({ width: "130px", height: "134px", 'max-height': "530px",'max-width': "534px"});
$('#' + '<%=dntbudget.ClientID%>').hover(function () {
//$(this).css({ width: "430px", height: "434px" });
$(this).animate({ width: "530px", height: "534px" }, 'slow');
}, function () {
// $(this).css({ width: "130px", height: "134px" });
$(this).animate({ width: "130px", height: "134px" }, 'slow');
});
由于 Dhaval soni