JS與CSS3實(shí)現(xiàn)圖片響應(yīng)鼠標(biāo)移動(dòng)放大效果示例-創(chuàng)新互聯(lián)

本文實(shí)例講述了JS與CSS3實(shí)現(xiàn)圖片響應(yīng)鼠標(biāo)移動(dòng)放大效果。分享給大家供大家參考，具體如下：

創(chuàng)新互聯(lián)公司是一家專業(yè)提供克州企業(yè)網(wǎng)站建設(shè),專注與成都網(wǎng)站設(shè)計(jì)、網(wǎng)站建設(shè)、H5響應(yīng)式網(wǎng)站、小程序制作等業(yè)務(wù)。10年已為克州眾多企業(yè)、政府機(jī)構(gòu)等服務(wù)。創(chuàng)新互聯(lián)專業(yè)的建站公司優(yōu)惠進(jìn)行中。

今天看網(wǎng)易的網(wǎng)站上，當(dāng)我把鼠標(biāo)放上去的時(shí)候發(fā)現(xiàn)圖片放大，移開圖片縮小，于是自行嘗試，結(jié)果如下。

方法一：使用js和css3

效果如圖：

這樣的實(shí)現(xiàn)非常簡(jiǎn)單，就是利用js的mouseover和 mouseout事件，但是不知道如何使圖片從中間放大，日后再行嘗試吧，代碼如下：

當(dāng)前題目：JS與CSS3實(shí)現(xiàn)圖片響應(yīng)鼠標(biāo)移動(dòng)放大效果示例-創(chuàng)新互聯(lián)
網(wǎng)站網(wǎng)址：http://m.jiaotiyi.com/article/doghcg.html