# show、pos、display

### HTML 代码

<div> 想要什么样的效果？ 选择 <select id="showStart" size="1"> <option value="tl">左上角</option> <option value="tr">右上角</option> <option value="bl">左下角</option> <option value="br">右下角</option> <option value="t">上边</option> <option value="b">下边</option> <option value="l">左边</option> <option value="r">右边</option> <option value="tc">上边中心</option> <option value="bc" selected="selected">下边中心</option> <option value="lm">左边中心</option> <option value="rm">右边中心</option> <option value="cm">中心</option> </select> 然后将鼠标移到图片上： </div> <div> <img src="images/big_1.jpg" alt="演示图片一" class="show1Thumbnail" /> <img src="images/big_2.jpg" alt="演示图片二" class="show1Thumbnail" /> <img src="images/big_3.jpg" alt="演示图片三" class="show1Thumbnail" /> <img src="images/big_4.jpg" alt="演示图片四" class="show1Thumbnail" /> <img src="images/big_5.jpg" alt="演示图片五" class="show1Thumbnail" /> </div> <div id="show1"><img src="" alt="演示图片" id="show1Img" /></div>

### JavaScript 代码（ezj 代码）

ezj.ready(function(){ $(".show1Thumbnail").mouseover(function(e){ show1Img.src = e.src; show1.display(true); show1.pos(e, "cto"); show1.show(showStart.sel()[0].value, "max", "fast"); }); $(".show1Thumbnail").mouseout(function(e){ show1.show("cur", "bc", "fast"); }); });

### 演示

想要什么样的效果？ 选择
然后将鼠标移到图片上：