• 动漫瀑布流


     1 <link type="text/css" rel="stylesheet" href="https://files.cnblogs.com/share1987/waterfall.css" />
     2 <script language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     3 <script type="text/javascript" src="https://files.cnblogs.com/share1987/jquery.waterfall.weibo.js"></script>
     4 <script type="text/javascript">
     5 // <![CDATA[
     6 $(function(){
     7 $('#waterfall').waterfall({
     8   colWidth: 144,
     9   perNum: 'auto',    // 每次显示五个
    10   ajaxTimes: 2,    // 只发送一次请求
    11   // 跨域请求
    12   ajaxFunc: function(successCallback, errorCallback){
    13      $.ajax({
    14      type: 'GET',
    15      url: 'https://files.cnblogs.com/share1987/jsonCallback.weibo.js?callback=?',
    16      cache: false,
    17      dataType:'jsonp',
    18      jsonpCallback: 'wf_callback',
    19      timeout: 6000,
    20      success: successCallback,
    21      error: errorCallback
    22      });
    23   }});
    24 });
    25 // ]]>
    26 </script>
    27 <div id="waterfall"></div>

    下载地址  转载地址

    效果如下

     
  • 相关阅读:
    前端之CSS
    mysql数据库 -- Navicat、pycharm连接数据库
    mysql数据库之表查询
    mysql 数据库之表操作
    前端 HTML
    数据库设计(第一范式,第二范式,第三范式
    MySQL之锁、事务、优化、OLAP、OLTP
    MySQL之创建用户和授权
    MySQL之索引原理与慢查询优化
    MySQL之视图、触发器、事务、存储过程、函数
  • 原文地址:https://www.cnblogs.com/share1987/p/Waterfall.html
Copyright © 2020-2023  润新知