PIXNET Logo登入

工作需要筆記

跳到主文

歡迎光臨amychang2014在痞客邦的小天地

部落格全站分類:不設分類

  • 相簿
  • 部落格
  • 留言
  • 名片
  • 10月 26 週一 201517:34
  • js mobile swipe

/* element_id 物件id
/* trigger_prev 上一張圖
/* trigger_next 下一張圖
/*Amy's swipe*/
function swipe(element_id, trigger_prev, trigger_next) {
var top = 0;
var offset = 0;
var x_start = 0;
var x_end = 0;
var y_start = 0;
var y_end = 0;
document.getElementById(element_id).addEventListener('touchstart', function (e) {
top = $(document).scrollTop();
var touch = e.touches[0];
x_start = touch.pageX;
y_start = touch.pageY;
}, false);
document.getElementById(element_id).addEventListener('touchmove', function (e) {
//e.preventDefault();
var touch = e.touches[0];
x_end = touch.pageX;
y_end = touch.pageY;
}, false);
document.getElementById(element_id).addEventListener('touchend', function (e) {
offset = Math.abs(y_start - y_end);
if (offset < 30) {
if ((x_start - x_end) > 60) {
$(trigger_prev).trigger('click');
}
if ((x_end - x_start) > 60) {
$(trigger_next).trigger('click');
}
}
}, false);
}
(繼續閱讀...)
文章標籤

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

  • 個人分類:JavaScript
▲top
  • 10月 01 週四 201510:49
  • CSS Firefox table

table-layout: fixed
 
http://stackoverflow.com/questions/3809804/css-table-width100-displayblock-not-working-in-firefox
(繼續閱讀...)
文章標籤

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

  • 個人分類:CSS
▲top
  • 9月 24 週四 201514:12
  • css div absolute 置中

<body><divstyle="position: absolute;left:50%;"><divstyle="position: relative;left:-50%;border: dotted red 1px;">
I am some centered shrink-to-fit content!
<br/>
tum te tum
</div></div></body>
http://stackoverflow.com/questions/1776915/how-to-center-absolute-element-in-div
(繼續閱讀...)
文章標籤

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

  • 個人分類:CSS
▲top
  • 9月 22 週二 201518:07
  • 線上畫表格html

http://tabletag.net/
 
 
<table>
<tbody>
<tr>
<td colspan="2" rowspan="2"></td>
<td></td>
<td colspan="2"></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
<td colspan="2"></td>
</tr>
</tbody>
</table>
(繼續閱讀...)
文章標籤

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

  • 個人分類:CSS
▲top
  • 9月 22 週二 201514:14
  • css IE8支援@media

https://raw.githubusercontent.com/scottjehl/Respond/master/src/respond.js
<scriptsrc="jquery-1.10.2.min.js"></script>
<scriptsrc="respond.min.js"></script>
(繼續閱讀...)
文章標籤

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

  • 個人分類:CSS
▲top
  • 9月 14 週一 201515:00
  • CSS 字型大小 px, pt , em , rem,%

http://bunnymoon0326.weebly.com/blog/css-px-pt-em-rem
(繼續閱讀...)
文章標籤

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

  • 個人分類:CSS
▲top
  • 9月 14 週一 201510:35
  • border-radius.htc

http://mepopedia.com/forum/read.php?804,15393
--Do not remove this if you are using--
Original Author: Remiz Rahnas
Original Author URL: http://www.htmlremix.com
Published date: 2008/09/24

Changes by Nick Fetchak:
- IE8 standards mode compatibility
- VML elements now positioned behind original box rather than inside of it - should be less prone to breakage
Published date : 2009/11/18


<public:attach event="oncontentready" onevent="oncontentready('v08vnSVo78t4JfjH')" />
<script type="text/javascript">

// findPos() borrowed from http://www.quirksmode.org/js/findpos.html
function findPos(obj) {
var curleft = curtop = 0;

if (obj.offsetParent) {
do {
curleft += obj.offsetLeft;
curtop += obj.offsetTop;
} while (obj = obj.offsetParent);
}

return({
'x': curleft,
'y': curtop
});
}

function oncontentready(classID) {
if (this.className.match(classID)) { return(false); }

if (!document.namespaces.v) { document.namespaces.add("v", "urn:schemas-microsoft-com:vml"); }

this.className = this.className.concat(' ', classID);
var arcSize = Math.min(parseInt(this.currentStyle['-moz-border-radius'] ||
this.currentStyle['-webkit-border-radius'] ||
this.currentStyle['border-radius'] ||
this.currentStyle['-khtml-border-radius']) /
Math.min(this.offsetWidth, this.offsetHeight), 1);
var fillColor = this.currentStyle.backgroundColor;
var fillSrc = this.currentStyle.backgroundImage.replace(/^url\("(.+)"\)$/, '$1');
var strokeColor = this.currentStyle.borderColor;
var strokeWeight = parseInt(this.currentStyle.borderWidth);
var stroked = 'true';
if (isNaN(strokeWeight)) {
strokeWeight = 0;
strokeColor = fillColor;
stroked = 'false';
}

this.style.background = 'transparent';
this.style.borderColor = 'transparent';

// Find which element provides position:relative for the target element (default to BODY)
var el = this;
var limit = 100, i = 0;
while ((typeof(el) != 'unknown') && (el.currentStyle.position != 'relative') && (el.tagName != 'BODY')) {
el = el.parentElement;
i++;
if (i >= limit) { return(false); }
}
var el_zindex = parseInt(el.currentStyle.zIndex);
if (isNaN(el_zindex)) { el_zindex = 0; }
//alert('got tag '+ el.tagName +' with pos '+ el.currentStyle.position);

var rect_size = {
'width': this.offsetWidth - strokeWeight,
'height': this.offsetHeight - strokeWeight
};
var el_pos = findPos(el);
var this_pos = findPos(this);
this_pos.y = this_pos.y + (0.5 * strokeWeight) - el_pos.y;
this_pos.x = this_pos.x + (0.5 * strokeWeight) - el_pos.x;

var rect = document.createElement('v:roundrect');
rect.arcsize = arcSize +'px';
rect.strokecolor = strokeColor;
rect.strokeWeight = strokeWeight +'px';
rect.stroked = stroked;
rect.style.display = 'block';
rect.style.position = 'absolute';
rect.style.top = this_pos.y +'px';
rect.style.left = this_pos.x +'px';
rect.style.width = rect_size.width +'px';
rect.style.height = rect_size.height +'px';
rect.style.antialias = true;
rect.style.zIndex = el_zindex - 1;

var fill = document.createElement('v:fill');
fill.color = fillColor;
fill.src = fillSrc;
fill.type = 'tile';

rect.appendChild(fill);
el.appendChild(rect);

var css = el.document.createStyleSheet();
css.addRule("v\\:roundrect", "behavior: url(#default#VML)");
css.addRule("v\\:fill", "behavior: url(#default#VML)");

isIE6 = /msie|MSIE 6/.test(navigator.userAgent);
// IE6 doesn't support transparent borders, use padding to offset original element
if (isIE6 && (strokeWeight > 0)) {
this.style.borderStyle = 'none';
this.style.paddingTop = parseInt(this.currentStyle.paddingTop || 0) + strokeWeight;
this.style.paddingBottom = parseInt(this.currentStyle.paddingBottom || 0) + strokeWeight;
}

if (typeof(window.rounded_elements) == 'undefined') {
window.rounded_elements = new Array();

if (typeof(window.onresize) == 'function') { window.previous_onresize = window.onresize; }
window.onresize = window_resize;
}
this.element.vml = rect;
window.rounded_elements.push(this.element);
}

function window_resize() {
if (typeof(window.rounded_elements) == 'undefined') { return(false); }

for (var i in window.rounded_elements) {
var el = window.rounded_elements[i];

var strokeWeight = parseInt(el.currentStyle.borderWidth);
if (isNaN(strokeWeight)) { strokeWeight = 0; }

var parent_pos = findPos(el.vml.parentNode);
var pos = findPos(el);
pos.y = pos.y + (0.5 * strokeWeight) - parent_pos.y;
pos.x = pos.x + (0.5 * strokeWeight) - parent_pos.x;

el.vml.style.top = pos.y +'px';
el.vml.style.left = pos.x +'px';
}

if (typeof(window.previous_onresize) == 'function') { window.previous_onresize(); }
}
</script>
(繼續閱讀...)
文章標籤

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

  • 個人分類:CSS
▲top
  • 9月 14 週一 201510:25
  • CSS circle IE8

border: 1px solid #696;
padding: 60px 0;
text-align: center; width: 200px;
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;
-webkit-box-shadow: #666 0px 2px 3px;
-moz-box-shadow: #666 0px 2px 3px;
box-shadow: #666 0px 2px 3px;
background: #EEFF99;
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#EEFF99), to(#66EE33));
background: -webkit-linear-gradient(#EEFF99, #66EE33);
background: -moz-linear-gradient(#EEFF99, #66EE33);
background: -ms-linear-gradient(#EEFF99, #66EE33);
background: -o-linear-gradient(#EEFF99, #66EE33);
background: linear-gradient(#EEFF99, #66EE33);
-pie-background: linear-gradient(#EEFF99, #66EE33);
behavior: url(/pie/PIE.htc);
(繼續閱讀...)
文章標籤

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

  • 個人分類:CSS
▲top
  • 9月 10 週四 201516:05
  • javascript 手機驗證

var MobileReg = /^(09)[0-9]{8}$/;
(str.match(MobileReg)) ? true : false
(繼續閱讀...)
文章標籤

amychang2014 發表在 痞客邦 留言(0) 人氣(2,337)

  • 個人分類:jQuery
▲top
  • 9月 10 週四 201509:40
  • Bootstrap 3 Datepicker Using Locales

<div class="container">
<div class="row">
<div class='col-sm-6'>
<div class="form-group">
<div class='input-group date' id='datetimepicker2'>
<input type='text' class="form-control" />
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
<script type="text/javascript">
$(function () {
$('#datetimepicker2').datetimepicker({
locale: 'ru'
});
});
</script>
</div>
</div>
(繼續閱讀...)
文章標籤

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

  • 個人分類:ASP.NET C#
▲top
«1...34539»

個人資訊

amychang2014
暱稱:
amychang2014
分類:
不設分類
好友:
累積中
地區:

熱門文章

  • (1,234)c#移除HTML Tag
  • (544)ASP.NET C# 取得圖片長、寬by stream
  • (33)[PhoneGap] 獲得目前地理位置
  • (26)jQuery取url變數
  • (14)社會創新
  • (11)jQuery selector class child each
  • (9)C# Convert、Parse、TryParse、(int) 區別使用
  • (6)jQuery select ASP.NET Control
  • (2)INSERT、UPDATE FROM SELECT
  • (3)Beauty Design

文章分類

  • RWD (0)
  • JSON (1)
  • 物件導向 (1)
  • ASP.NET MVC (1)
  • JSON (1)
  • Google API (2)
  • IIS (3)
  • SQL (15)
  • CSR企業社會責任 (3)
  • PhoneGap (19)
  • Mobile (2)
  • Design (3)
  • CSS (38)
  • 其它 (18)
  • New Project (1)
  • jQuery (71)
  • MSSQL (12)
  • ASP.NET C# (136)
  • Facebook (5)
  • JavaScript (48)
  • 未分類文章 (1)

最新文章

  • 上傳前預覽
  • SQL 排序置換
  • 臨時網址
  • C# 載入資料夾內所有圖片
  • 判別行動裝置
  • 使用a 呼叫js 埋ga
  • C# 直接下載檔案
  • 圖片按鈕 input file
  • [轉貼]上傳檔案前,JavaScript檢查檔案格式、大小
  • css goTop

文章精選

文章搜尋

參觀人氣

  • 本日人氣:
  • 累積人氣: