CSS-Tricks по-русски. Скрипты.

CSS: CSS для IE 6 и 7

Sun, 11 Dec 2016 21:26:12 GMT

#someElement {  
	background: red; /* современные браузеры */  
	*background: green; /* IE 7 и младше */  
	_background: yellow; /* только IE6 */  
}

Тоже самое на сайте.

jQuery: Поиск строки на странице

Sun, 11 Dec 2016 21:26:12 GMT

var foundin = $('*:contains("строка для поиска")');

Тоже самое на сайте.

jQuery: Обработка нажатия клавиш

Sun, 11 Dec 2016 21:26:12 GMT

$(function() {
    $(document).keypress(function(e){
        switch(e.which){
        // "ENTER"
        case 13:
        alert('enter pressed');
        break;
        // "s"
        case 115:
        alert('s pressed');
        break;
        (...)
        }
    });
});

Тоже самое на сайте.

jQuery: Центрируем элемент

Sun, 11 Dec 2016 21:26:12 GMT

jQuery.fn.center = function () {
    this.css("position","absolute");
    this.css("top", ( $(window).height() - this.height() ) / 2+$(window).scrollTop() + "px");
    this.css("left", ( $(window).width() - this.width() ) / 2+$(window).scrollLeft() + "px");
    return this;
}

//Применяем функцию:
$(element).center();

Тоже самое на сайте.

jQuery: Собственный селектор

Sun, 11 Dec 2016 21:26:12 GMT

//расширяем функциональность jQuery
$.extend($.expr[':'], {
    //имя вашего селектора
    moreThanAThousand : function (a){
        //соответствующий элемент
        return parseInt($(a).html()) > 1000;
    }
});
// пример использования
$(document).ready(function() {
    $('td:moreThanAThousand').css('background-color', '#ff0000');
});

Тоже самое на сайте.

jQuery: Выключаем RightClick

Sun, 11 Dec 2016 21:26:12 GMT

$(document).ready(function(){
    $(document).bind("contextmenu",function(e){
        return false;
    });
});

Тоже самое на сайте.

jQuery: Сортировка списка

Sun, 11 Dec 2016 21:26:12 GMT

<ul>
<li>cloud</li>
<li>sun</li>
<li>rain</li>
<li>snow</li>
</ul>

var items = $('.to_order li').get();
items.sort(function(a,b){
    var keyA = $(a).text();
    var keyB = $(b).text();

    if (keyA < keyB) return -1;
    if (keyA > keyB) return 1;
    return 0;
});
var ul = $('.to_order');
$.each(items, function(i, li){
    ul.append(li);
});

Тоже самое на сайте.

javaScript: Валидация email

Sun, 11 Dec 2016 21:26:12 GMT

var email = 'info@css-tricks.ru'
if(!(/^((([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+(\.([a-z]|\d|[!#\$%&'\*\+\-\/=\?\^_`{\|}~]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])+)*)|((\x22)((((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(([\x01-\x08\x0b\x0c\x0e-\x1f\x7f]|\x21|[\x23-\x5b]|[\x5d-\x7e]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(\\([\x01-\x09\x0b\x0c\x0d-\x7f]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF]))))*(((\x20|\x09)*(\x0d\x0a))?(\x20|\x09)+)?(\x22)))@((([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|\d|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.)+(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])|(([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])([a-z]|\d|-|\.|_|~|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])*([a-z]|[\u00A0-\uD7FF\uF900-\uFDCF\uFDF0-\uFFEF])))\.?$/i.test(email)))
	alert('Invalid Email');

Тоже самое на сайте.

javaScript: rgb2hex

Sun, 11 Dec 2016 21:26:12 GMT


function colorToHex(color) {
    if (color.substr(0, 1) === '#') {
        return color;
    }
    var digits = /rgb\((\d+), (\d+), (\d+)\)/.exec(color);
    var red = parseInt(digits[1]);
    var green = parseInt(digits[2]);
    var blue = parseInt(digits[3]);
    var dec = red + 256 * green + 65536 * blue
    return '#' + dec.toString(16);
};

Тоже самое на сайте.

jQuery: Ссылки в новом окне

Sun, 11 Dec 2016 21:26:12 GMT

HTML

<a href="http://www.css-tricks.ru/" rel="external">Внешняя ссылка</a>

jQuery

$(function() {
	$("a[rel='external']").click(function() {
		window.open(this.href);
		return false;
	});
});

Тоже самое на сайте.