#overlay {
position: fixed;
目前分類：jQuery (71)
- Oct 23 Thu 2014 17:12
jQuery 遮罩
- Oct 03 Fri 2014 09:42
jQuery 處理上傳相同檔案事件不觸發狀況
- Oct 02 Thu 2014 15:58
jQuery & InputFile 驗證檔案單個尺寸
<input type="file" name="FileUpload1" id="FileUpload1" class="form-control" style="width:400px;" runat="server" />
<img id="testImg" src="#" alt="your image" />
<script>
$(function () {
$('#testImg').hide();
});
function getImgSize(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#testImg').attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
$('#testImg').on('load', function () {
if (($(this).width() == 77) && ($(this).height() == 50)) {
} else {
$('#<%=FileUpload1.ClientID%>').val('');
alert('※上傳檔案尺寸不符規定※');
}
})
$('#<%=FileUpload1.ClientID%>').change(function () {
getImgSize(this);
});
</script>
- Oct 02 Thu 2014 15:57
jQuery & InputFile 驗證檔案尺寸
<img id="testImg1" src="#" alt="your image" />
<img id="testImg2" src="#" alt="your image" />
<script>
$(function () {
$('#testImg1').hide();
$('#testImg2').hide();
});
function getImgSize(input, id) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (e) {
$('#testImg' + id).attr('src', e.target.result);
}
reader.readAsDataURL(input.files[0]);
}
}
$('#testImg1').on('load', function () {
if (($(this).width() == 77) && ($(this).height() == 50)) {
} else {
$('#<%=FileUpload1.ClientID%>').val('');
alert('※上傳檔案尺寸不符規定1※');
}
})
$('#testImg2').on('load', function () {
if (($(this).width() == 77) && ($(this).height() == 50)) {
} else {
$('#<%=FileUpload2.ClientID%>').val('');
alert('※上傳檔案尺寸不符規定2※');
}
})
$('#<%=FileUpload1.ClientID%>').change(function () {
getImgSize(this, 1);
});
$('#<%=FileUpload2.ClientID%>').change(function () {
getImgSize(this, 2);
});
</script>
- Oct 02 Thu 2014 15:55
jQuery & InputFile 驗證檔案單個、多個大小
<input type="file" multiple="multiple" name="File1[]" id="File1" accept="image/*" class="yellowButton_fileupload" style="width:200px;" />
<script>
$(document).ready(function () {
$('#<%=按鈕_上傳.ClientID%>').hide();
});
$('input#File1').change(function () {
var files = $(this)[0].files;
var size = 0;
var check = 0;
for (var i = 0; i < files.length; i++) {
size = size + this.files[i].size;
if (this.files[i].size > 1024 * 1024) {
alert('單個檔案大小大於1MB，不允上傳');
$('input#File1').val('');
check = 1;
break;
}
}
if (check == 0) {
if (size > 1024 * 1024 * 10) {
//alert(size);
alert('您選擇上傳的檔案大小大於10MB，請重新選擇！');
$('input#File1').val('');
$('#<%=按鈕_上傳.ClientID%>').hide();
} else {
//alert('ok');
$('#<%=按鈕_上傳.ClientID%>').show();
}
}
});
</script>
- Oct 02 Thu 2014 10:26
jQuery取得FileUpload圖片大小
function getImgSize(input) {
if (input.files && input.files[0]) {
- Sep 30 Tue 2014 11:06
jQuery 判別上傳檔案個數及檔案大小
<input type="file" multiple="multiple" name="File1[]" id="File1" accept="image/*" class="yellowButton_fileupload" style="width:200px;" />
<script>
$('input#File1').change(function () {
var files = $(this)[0].files;
//alert(files.length);
var size = 0;
for (var i = 0; i < files.length; i++) {
size = size + this.files[i].size;
}
if (size > 1024 * 1024 * 10) {
//alert(size);
alert('您選擇上傳的檔案大小大於10MB，請重新選擇！');
$('#<%=按鈕_上傳.ClientID%>').hide();
} else {
//alert('ok');
$('#<%=按鈕_上傳.ClientID%>').show();
}
});
</script>
- Sep 30 Tue 2014 10:46
jQuery計算上傳檔案個數
in case of input type file the value is stored in array as files with key name.
$('input#my_id').change(function(){var files = $(this)[0].files;if(files.length >10){
alert("you can select max 10 files.");}else{
alert("correct, you have selected less than 10 files");}});fiddle example : http://jsfiddle.net/nze2B/3/
- Sep 09 Tue 2014 09:33
jQuery select ASP.NET Control
$('#<%=lblName.ClientID%>')
- Sep 01 Mon 2014 09:28
TinyMCE Custom toolbutton
<script type="text/javascript" src="<yourinstallationpath>/tinymce/tinymce.min.js"></script>
<scripttype="text/javascript">
- Aug 14 Thu 2014 12:09
jQuery 暫停youtube
$('#stop').on('click', function() {
//$('#popup-youtube-player').stopVideo();
- Jul 24 Thu 2014 17:44
jQuery 拖曳排序 & C# code-behind
<html lang="en">
<head>
- Jul 24 Thu 2014 16:17
Get the order of list item in jQuery sortable
<html lang="en">
<head>
- Jul 22 Tue 2014 14:43
Jquery Image Zoom Plugin
- Jun 30 Mon 2014 09:07
Jquery, changing background image with timer
http://stackoverflow.com/questions/16359492/changing-background-image-one-time-on-responsive-background-image
function test() {
$("img").each(function(index) {
- Jun 17 Tue 2014 14:01
多行文本溢出显示省略号(...)的方法
<div class="newsItemTitle">
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>
<div class="newsItemBox">
<div class="newsItemContent">
<asp:Label ID="Label1_1" runat="server" Text="Label"></asp:Label>
</div>
<div class="newsItemReadAll">
<asp:HyperLink ID="HyperLink1" runat="server"> ...《完整閱讀》</asp:HyperLink>
</div>
</div>
.newsItemBox {
z-index:1;
position: relative;
top: 0;
left: 0;
float: left;
width: 565px;
height: 80px;
}
.newsItemContent {
z-index:1;
position: relative;
top: 0;
left: 0;
padding: 5px 0 0 5px;
float: left;
width: 565px;
height: 80px; /*95px;*/
line-height: 20px;
font-size: 12px;
font-family: 新細明體;
color: #e5e5e5;
text-overflow:ellipsis;
-o-text-overflow:ellipsis;
text-align:justify;
overflow:hidden;
}
.newsItemReadAll {
z-index:888;
position: relative;
top: -21px;
left: 446px;
padding: 5px 0 0 5px;
float: left;
width: 120px;
height: 12px; /*95px;*/
font-size: 12px;
font-family: 新細明體;
text-align:right;
vertical-align:bottom;
color: #ff6a00;
background-image: -ms-linear-gradient(left, rgba(0,0,0,0) 8%, rgb(0,0,0,0) 20%);
/* Mozilla Firefox */
background-image: -moz-linear-gradient(left, rgba(0,0,0,0) 8%, rgb(0,0,0,0) 20%);
/* Opera */
background-image: -o-linear-gradient(left, rgba(0,0,0,0) 8%, rgb(0,0,0,0) 20%);
/* Webkit (Safari/Chrome 10) */
background-image: -webkit-gradient(linear, left, right, color-stop(0, rgba(0,0,0,0)), color-stop(1, rgb(0,0,0)));
/* Webkit (Chrome 11+) */
background-image: -webkit-linear-gradient(left, rgba(0,0,0,0) 8%,rgb(0,0,0) 20%);
/* W3C Markup, IE10 Release Preview */
background-image: linear-gradient(to right, rgba(0,0,0,0) 8%, rgb(0,0,0) 20%);
}
- May 30 Fri 2014 17:59
jQuery UI Bootstrap
- May 26 Mon 2014 10:47
- Chained Selects Plugin for jQuery and Zepto
