MVC3.0图片滚动和相册展示(下)
首先：加上js文件和css样式文件jquery.ad-gallery.css，参照(MVC3.0图片上传的js 文件)。
其次:在view层套用相应的div样式，即可实现滚动。可以选择滚动方式，左右，垂直，渐进，动态，还可以选择使用幻灯片方式进行预览
使用jquery 相应控制，即:
jquery 控制滚动方式 Code
1 //滚动方式
2 <select id="switch-effect">
3 <option value="slide-hori">水平滚动</option>
4 <option value="slide-vert">垂直滚动</option>
5 <option value="resize">动态变化</option>
6 <option value="fade">渐进渐出</option>
7 </select>
8 <a href="#" id="toggle-slideshow">显示/隐藏幻灯片开关</a>
9
10
11
12 // jquery代码
13 $(function ()
14 {
15 $(".thumb").LoadThumImage(true, 60);
16 var galleries = $('.ad-gallery').adGallery();
17 $('#switch-effect').change(
18 function ()
19 {
20 galleries[0].settings.effect = $(this).val();
21 return false;
22 }
23 );
24 $('#toggle-slideshow').click(
25 function ()
26 {
27 galleries[0].slideshow.toggle();
28 return false;
29 }
30 );
31 });
在view层套用相应div
套用div Code
1 <div id="gallery" class="ad-gallery">
2 <div class="ad-image-wrapper">
3 <img class="showPhoto" />
4 </div>
5 <div class="ad-controls">
6 </div>
7 <div class="ad-nav">
8 <div class="ad-thumbs">
9 <ul class="ad-thumb-list">
10 图片循环遍历显示，记住：样式！！<img src="" class="thumb" alt="" />
11 </ul>
12 </div>
13 </div>
14 </div>
当加载的相册图片不显示的时候，温馨提示一张封面”相册暂无图片“！
最后，有关的相册的分类和编辑，就直接对DB的操作。
总结：关键在于搜索相应的相册模式，有些网上的代码存在兼容性或者js报错的情况。同事经筛选选择此模板，感谢同事！
在嵌套相应的div的时候要仔细。
