img图片放大控件 lightbox.js

时间:2021-12-15 04:51:10

1.引入相关js,css

jquery-1.7.2.min.js,lightbox.css,lightbox.js
 
2 图片增加<a href="大图片地址" rel="lightbox"></a>
 
如       <a href="2.jpg" rel="lightbox"><img src="1.jpg"/><a>
 
 
 
附:jquery代码   页面加载完毕,获取所有img,如果img的src地址后缀为670x670,则需实现点击放大功能
 jQuery(document).ready(function (){
 jQuery('img').each(function() {
  var img = jQuery(this);
  if(img.attr('src') != null && /^.+\_670x670\..*$/.test(img.attr('src')))
     var imgUrl=img.attr('src');
   imgUrl.replace("_670x670","");
   img.wrap('<a href='+imgUrl+' rel="lightbox" ></a>');
  });
});