kinMaxShow 默认效果演示

上面为 kinMaxShow 默认效果代码如下：


javascript 代码

<script src="js/jquery-1.10.2.min.js" type="text/javascript"></script>

<script src="js/jquery.kinMaxShow-1.0.min.js" type="text/javascript"></script>

<script type="text/javascript">

	$(function(){

		$("#kinMaxShow").kinMaxShow();

	});

</script>


HTML 代码

<div id="kinMaxShow">



    <div>

        <a href="https://www.jq22.com" target="_blank"><img src="images/demo_default_images/1.jpg"   /></a>

    </div>

    

    <div>

        <a href="https://www.jq22.com" target="_blank"><img src="images/demo_default_images/2.jpg"  /></a>

    </div>

    

    <div>

        <a href="https://www.jq22.com" target="_blank"><img src="images/demo_default_images/3.jpg"   /></a>

    </div>

    

    <div>

        <a href="https://www.jq22.com" target="_blank"><img src="images/demo_default_images/4.jpg"   /></a>

    </div>



    <div>

        <a href="https://www.jq22.com" target="_blank"><img src="images/demo_default_images/5.jpg"   /></a>

    </div>



    <div>

        <a href="https://www.jq22.com" target="_blank"><img src="images/demo_default_images/6.jpg"   /></a>

    </div>		

        

</div>

IE浏览器下在页面刚加载， js代码还未执行时候会出现一瞬间“常见”的“闪动”，为kinMaxShow 容器添加一句CSS display:none 即可解决，而且最好放在页面头部或是头部CSS文件中。(此方式不保留占位)


CSS样式

<style type="text/css">

	#kinMaxShow{display:none;}

</style>

也可以这样设置 kinMaxShow容器的CSS样式 (此方式保留占位)


CSS样式

<style type="text/css">

	/* 高度为焦点图高度 */

	#kinMaxShow{visibility:hidden;width:100%; height:500px;overflow:hidden;}

</style>