本文實例為大家分享了angularjs點擊圖片放大預(yù)覽的具體代碼，供大家參考，具體內(nèi)容如下
成都創(chuàng)新互聯(lián)公司專注于紅塔企業(yè)網(wǎng)站建設(shè),成都響應(yīng)式網(wǎng)站建設(shè),商城建設(shè)。紅塔網(wǎng)站建設(shè)公司,為紅塔等地區(qū)提供建站服務(wù)。全流程定制網(wǎng)站開發(fā)，專業(yè)設(shè)計，全程項目跟蹤，成都創(chuàng)新互聯(lián)公司專業(yè)和態(tài)度為您提供的服務(wù)
承接上一篇文章
重慶分公司
重慶分公司
/*圖片點擊放大再點擊還原*/
angular.module('routerModule').directive('enlargePic',function(){//enlargePic指令名稱，寫在需要用到的地方img中即可實現(xiàn)放大圖片 return{
restrict: "AE",
link: function(scope,elem){
elem.bind('click',function($event){
var img = $event.srcElement || $event.target;
angular.element(document.querySelector(".mask"))[0].style.display = "block";
angular.element(document.querySelector(".bigPic"))[0].src = img.src;
})
}
}
})
.directive('closePic',function(){
return{
restrict: "AE",
link: function(scope,elem){
elem.bind('click',function($event){
angular.element(document.querySelector(".mask"))[0].style.display = "none";
})
}
}
});
以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持創(chuàng)新互聯(lián)。
