• 使用photowap插件


    使用photowap插件时,需要注意class.js,photowap.js,jquery.js这三个文件引入的先后顺序。

    正确顺序如下:

    <script type="text/javascript" src="js/outerJS/lib/klass.min.js"></script>
    <script type="text/javascript" src="../js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="js/outerJS/code.photoswipe-3.0.5.min.js"></script>

    使用的话只需要在document.ready函数里加上

     var myPhotoSwipe = $("#gallery a").photoSwipe({ enableMouseWheel: true , enableKeyboard: false });  //创建photoswipe实例

    中括号里的参数根据自己的选择写。

       <ul id="gallery" class="portfolioUl">
                    <li>
                        <a href="images/portfolio/001.jpg" rel="external"><img src="images/portfolio/001 (1).jpg"/></a>
                    </li>
                    <li>
                        <a href="images/portfolio/002.jpg" rel="external"><img src="images/portfolio/002 (1).jpg"/></a>
                      </li>
                       <li>
                           <a href="images/portfolio/003.jpg" rel="external"><img src="images/portfolio/003 (1).jpg"/></a>
                         </li>
                        <li>
                              <a href="images/portfolio/004.jpg" rel="external"><img src="images/portfolio/004 (1).jpg"/></a>
                          </li>
                        <li>
                             <a href="images/portfolio/005.jpg" rel="external"><img src="images/portfolio/005 (1).jpg"/></a>
                        </li>
                        <li>
                            <a href="images/portfolio/006.jpg" rel="external"><img src="images/portfolio/006 (1).jpg"/></a>
                          </li>
                         <li>
                             <a href="images/portfolio/007.jpg" rel="external"><img src="images/portfolio/007 (1).jpg"/></a>
                           </li>
                        <li>
                           <a href="images/portfolio/008.jpg" rel="external"><img src="images/portfolio/008 (1).jpg"/></a>
                         </li>
                        <li>
                            <a href="images/portfolio/009.jpg" rel="external"><img src="images/portfolio/009 (1).jpg"/></a>
                        </li>
                  
                </ul>

    想要了解photoswipe的更多用法,参考http://blog.csdn.net/renfufei/article/details/10360855

    人生短短几十年,要在有限的生命里多做店有意义的事情。莫要让自己迎合别人的眼光活着。随心而为,听从心的声音。讨好自己,悠哉悠哉!
  • 相关阅读:
    使用CodeQL寻找SSTI漏洞
    thinkphp3缓存漏洞
    SecCrawler windows配置
    了解ThinkPHP
    Mybaitsplus 开启SQL日志的两种方式
    找不对自定义typeHandler:java.lang.IllegalStateException: No typehandler found for mapping ...
    Windows编程系列:如何监测某个进程是否退出?
    什么时候在C#中使用结构体?
    解决git在push时,报git authentication failed的问题
    Deep3DFaceRecon_pytorch 运行错误
  • 原文地址:https://www.cnblogs.com/jiaojiaome/p/3494138.html
Copyright © 2020-2023  润新知