網頁測速工具pagespeed

https://developers.google.com/speed/pagespeed/insights/?hl=zh-TW

文章標籤

swordheart313 發表在 痞客邦 留言(0) 人氣()

讓圖片延遲載入,加快網頁開啟速度,為2.x版本使用方式:

1.頁面載入Jquery與Lazyload2.x版本js:

文章標籤

swordheart313 發表在 痞客邦 留言(0) 人氣()

網址:http://www.chartjs.org/
文檔:http://www.chartjs.org/docs/latest/general/interactions/modes.html

swordheart313 發表在 痞客邦 留言(0) 人氣()

载入 JavaScript 文件

<script src="jquery.js"></script>
<script src="jquery.kxbdmarquee.js"></script>

CSS 样式

/**
 * 父容器需要设置溢出隐藏
 * 如果是水平滚动,项目需要设置浮动
 */
#element_id{overflow:hidden;}
#element_id ul li{float:left;}

DOM 结构

<div id="element_id">
  <ul>
    <li>...</li>
    <li>...</li>
    <li>...</li>
  </ul>
</div>

JavaScript 调用方式

$('#element_id').kxbdMarquee();

参数说明

名称 默认值 说明
direction "left" 滚动方向。可设置为:"left", "right", "up", "down"
isEqual true 所有滚动的元素长宽是否相等。可设置为:true, false
loop 0 循环滚动次数,0 表示无限循环
scrollAmount 1 步长(px)
scrollDelay 20 时长(ms)

swordheart313 發表在 痞客邦 留言(0) 人氣()

參考自男丁格爾

<script>

swordheart313 發表在 痞客邦 留言(0) 人氣()

jQuery $(window).resize 視窗被調整過時,運行此函數,再使用$(window).width()取得目前遊覽器視窗寬度。

$(document).ready(function(){

文章標籤

swordheart313 發表在 痞客邦 留言(0) 人氣()

橫向合併: <td colspan="要橫跨的列數">

<table border="1" cellpadding="5">
    <tr>

swordheart313 發表在 痞客邦 留言(0) 人氣()

據官方文件說明如下:


文章標籤

swordheart313 發表在 痞客邦 留言(0) 人氣()

上一篇說到使用 display:table 讓div達城等高,但使用之後無法用margin來調整div之間的間隙。
如需要調整間隙,需要在display:table-cell的父層,也就是display:table這層加上 border-collapse 跟 border-spacing 。

swordheart313 發表在 痞客邦 留言(0) 人氣()

一、用flex :

css:

文章標籤

swordheart313 發表在 痞客邦 留言(0) 人氣()

1 2