Category "jQuery" (12)
«jQuery Trickshots» by tutorialzine.com ... Reveal Code
// Loop all .fetchSize links
$('a.fetchSize').each(function(){
// Issue an AJAX HEAD request for each one
var link = this;
$.ajax({
type: 'HEAD',
url: link.href,
complete: function(xhr){
var size = humanize(xhr.getResponseHeader('Content-Length'));
// Append the filesize to each
$(link).append(' (' + type + ')');
}
});
});
function humanize(size){
var units = ['bytes','KB','MB','GB','TB','PB'];
var ord = Math.floor( Math.log(size) / Math.log(1024) );
ord = Math.min( Math.max(0,ord), units.length-1);
var s = Math.round((size / Math.pow(1024,ord))*100)/100;
return s + ' ' + units[ord];
}
// html
// First Trickshot
// This Trickshot
// Ball.png
jQuery: Get data via Ajax
06.05.2013 03:14 TestUser jQuery
Get some data via Ajax, calling to a php-script and receiving a data. ... Reveal Code
$.ajax({
url: "ajax.php",
type: "POST",
data: "id=" + id_value + "&mode=" + mode_value,
cache: false,
success: function(data) {
$('#ajax_result').html($.trim(data))
}
});
Выделить этот текст!
и этот!
Выделить
... Reveal Code
function SelectText(element) {
var doc = document
, text = doc.getElementById(element)
, range, selection
;
if (doc.body.createTextRange) {
range = document.body.createTextRange();
range.moveToElementText(text);
range.select();
} else if (window.getSelection) {
selection = window.getSelection();
range = document.createRange();
range.selectNodeContents(text);
selection.removeAllRanges();
selection.addRange(range);
}
}
$(function() {
$('p').click(function() {
SelectText('selectme');
});
});
Finger Scroll (Скроллинг контента пальцем ) ... Reveal Code
jQuery.fn.oneFingerScroll = function() {
var scrollStartPos = 0;
$(this).bind('touchstart', function(event) {
var e = event.originalEvent;
scrollStartPos = $(this).scrollTop() + e.touches[0].pageY;
e.preventDefault();
});
$(this).bind('touchmove', function(event) {
var e = event.originalEvent;
$(this).scrollTop(scrollStartPos - e.touches[0].pageY);
e.preventDefault();
});
return this;
};
//usage
$('#scrollMe').oneFingerScroll();
Обнаружение изменения ориентации экрана ... Reveal Code
$(window).bind('orientationchange', function(event) {
someFunction();
});
rotate(obj, degree) ... Reveal Code
function rotate(obj, degree) {
$(obj).animate({
'-webkit-transform': 'rotate(' + degree + 'deg)',
'-moz-transform': 'rotate(' + degree + 'deg)',
'-ms-transform': 'rotate(' + degree + 'deg)',
'-o-transform': 'rotate(' + degree + 'deg)',
'transform': 'rotate(' + degree + 'deg)',
'zoom': 1
}, 5000);
}
Выдернуто откуда-то из просторов сети и доработано
Требование:
Наличие на странице обертки , в которую будет грузиться страница
Наличие обертки , для показа во время ожидания загрузки
Примеры ajax-ссылки:
ajax-ссылка
ajax-ссылка ... Reveal Code
var default_content="";
$(document).ready(function(){
checkURL();
$('a').click(function (e){
checkURL(this.hash);
});
default_content = $('#ajaxContent').html();
setInterval("checkURL()",250);
});
var lasturl="";
function checkURL(hash)
{
if(!hash) hash=window.location.hash;
if(hash != lasturl)
{
backurl=lasturl;
lasturl=hash;
if(hash==""){
$('#ajaxContent').html(default_content);
}else{
loadPage(hash,backurl);
}
}
}
function loadPage(url,backurl)
{
toSend = new Object();
toSend.url = url;
toSend.backurl = backurl;
toSend.path = window.location.pathname;
str_json = JSON.stringify(toSend);
$('#loading').css('visibility','visible');
$.ajax({
type: "POST",
url: "ajax.php",
data: {act:"loadpage",param:str_json},
success: function(response){
if(parseInt(response)!=0)
{
$('#ajaxContent').html(response);
$('#loading').css('visibility','hidden');
}
}
});
}
jQuery: Keyboard shortcut
Using the keyboard shortcut to increase the value in the input field ... Reveal Code
var isShift = false;
$('input[type="text"]').keyup( function(e){
if (e.which == 16 ) isShift = false;
}).keydown( function(e) {
$(this).attr('autocomplete',"off");
// Shift key
if(e.which == 16) isShift = true;
var v = (isShift == true) ? 10 : 1;
// Arrow up code
if (e.keyCode == 38)
$(this).val( parseInt( $(this).val() ) + v );
// Arrow down code
if (e.keyCode == 40)
$(this).val( parseInt( $(this).val() ) - v );
});
jQuery: Growl-like messages
Simple Growl-like messages (top-right corner of a page) ... Reveal Code
jQuery: Enable the button when there is text in the text field
Enable the button ("Submit" or other) when there is text in the text field ... Reveal Code
$('#myTextField').keyup(function() {
$('#myButton').attr('disabled', !$('#myTextField').val());
});
jQuery: Scroll to top
Scroll the page to its top ... Reveal Code
$("a[href='#top']").click(function() {
$("html, body").animate({ scrollTop: 0 }, "fast");
return false;
});
jQuery: Fade in then fade out
Fade in the hidden element, wait a little bit, then fade out id. Simple but useful. ... Reveal Code
$("#error_box").fadeIn(500).delay(3000).fadeOut(500);