瑕佷娇鐢╨ightbox.js鎻掍欢锛屾偍闇€瑕佹寜鐓т互涓嬫楠よ繘琛屾搷浣滐細

1. 棣栧厛锛屾偍闇€瑕佷笅杞絣ightbox.js鎻掍欢鐨勬簮浠ｇ爜鏂囦欢銆傛偍鍙互鍦╨ightbox.js鐨勫畼鏂圭綉绔欙紙鎴栧叾浠栬祫婧愮綉绔欙級涓婃壘鍒板苟涓嬭浇瀹冦€?/p>

2. 灏嗕笅杞界殑鏂囦欢瑙ｅ帇缂╋紝骞跺皢鍏朵腑鐨刲ightbox.js鏂囦欢澶嶅埗鍒版偍鐨勯」鐩枃浠跺す涓殑鍚堥€備綅缃€?/p>

3. 鍦ㄦ偍鐨凥TML鏂囦欢涓紝寮曞叆lightbox.js鏂囦欢銆傛偍鍙互浣跨敤浠ヤ笅浠ｇ爜灏嗗叾娣诲姞鍒?head>鏍囩涓細

<script src="path/to/lightbox.js"></script>

璇风‘淇濆皢"path/to/lightbox.js"鏇挎崲涓哄疄闄呯殑鏂囦欢璺緞銆?/p>

4. 鍦ㄦ偍鐨凥TML鏂囦欢涓紝鍒涘缓涓€涓寘鍚鏄剧ず鍥剧墖鐨?a>鏍囩銆備緥濡傦細

<a href="path/to/image.jpg" data-lightbox="image-1" data-title="Image 1">
<img src="path/to/thumbnail.jpg" alt="Image 1">
</a>

璇风‘淇濆皢"path/to/image.jpg"鍜?quot;path/to/thumbnail.jpg"鏇挎崲涓哄疄闄呯殑鍥剧墖璺緞鍜岀缉鐣ュ浘璺緞銆?/p>

5. 鍦ㄦ偍鐨凥TML鏂囦欢涓紝娣诲姞浠ヤ笅JavaScript浠ｇ爜鏉ュ垵濮嬪寲lightbox.js鎻掍欢锛?/li>

<script>
lightbox.option({
'resizeDuration': 200,
'wrapAround': true
})
</script>

鎮ㄥ彲浠ユ牴鎹渶瑕佽皟鏁撮€夐」鐨勫€笺€?/p>

6. 鏈€鍚庯紝閫氳繃鍦ㄦ祻瑙堝櫒涓墦寮€鎮ㄧ殑HTML鏂囦欢锛屾偍灏卞彲浠ョ湅鍒發ightbox.js鎻掍欢鍦ㄦ偍鐨勫浘鐗囦笂鐨勬晥鏋滀簡銆?/li>

璇锋敞鎰忥紝杩欏彧鏄竴涓畝鍗曠殑浣跨敤绀轰緥锛屾偍鍙互鏍规嵁lightbox.js鎻掍欢鐨勬枃妗ｅ拰鎮ㄧ殑椤圭洰闇€姹傝繘琛屾洿澶氱殑瀹氬埗鍜岄厤缃€?/p>