婚紗網站jQuery大屏幕廣告插件

超大圖片居中顯示

在CMS類型網站，後臺信息錄入人員插入圖片一般通過IMG標籤插入，但是當圖片太大的時候，圖片中間內容不會始終居中顯示。此插件適合網頁中的插入大型圖片廣告，動態讓圖片廣告中的元素保持始終居中。

引入依賴文件

http://michaelray.coding.me/jquery-banner/jquery.banner.js

讓選擇器“.ad, .adf”的元素始終居中

$.banner.center({target:’.ad, .adf’});

  <a href="#">
	 <img class="ad" src="img/big.jpg" width="2560"/>
  </a>

DEMO：http://michaelray.coding.me/jquery-banner/demo.html

下拉大廣告

DEMO：http://michaelray.coding.me/jquery-banner/stretch_demo1.html

$.banner.stretch({ big: ‘.stretch-banner’});

<div class="stretch-banner">
  <a href="#" target="_blank"><IMG src="img/1920.jpg" width="1100" ></a>
</div>

大小廣告交替顯示

先顯示小廣告，然後會出現一個大廣告，最後又變成小廣告

DEMO：http://michaelray.coding.me/jquery-banner/stretch_demo2.html

<!--小廣告-->
<div style="DISPLAY: block" id="js_ads_banner_top">
	<a href="#" target=_blank><IMG src="img/banner_s.jpg" width="960" height="70"></a>
</div>

<!--大廣告-->
<div style="DISPLAY: none" id="js_ads_banner_top_slide">
	<a href="#" target=_blank><IMG src="img/banner_b.jpg" width="960"></a>
</div>

$.banner.stretch({
	big    : '#js_ads_banner_top_slide',
	small  : '#js_ads_banner_top',
	repeat : true
});