pause: function () {
clearInterval(this.interval);
},
unpause: function () {
this.extendTimer(Math.round((new Date().getTime() - this.startedAt.getTime())/1000) - this.secondsElapsed);
this.interval = setInterval(jQuery.proxy(this._draw, this), 1000);
}
_draw: function () {
var secondsElapsed = Math.round((new Date().getTime() - this.startedAt.getTime())/1000),
endAngle = (Math.PI*3.5) - (((Math.PI*2)/this.settings.seconds) * secondsElapsed);
this.secondsElapsed = secondsElapsed;
this._clearRect();
this._drawCountdownShape(Math.PI*3.5, false);
if (secondsElapsed < this.settings.seconds) {
this._drawCountdownShape(endAngle, true);
this._drawCountdownLabel(secondsElapsed);
} else {
this._drawCountdownLabel(this.settings.seconds);
this.stop();
this.settings.onComplete();
}
}
this.secondsElapsed = secondsElapsed;
(function(){
//Сохраняем ссылку на стандартный метод jQuery
var originalAddClassMethod = jQuery.fn.addClass;
//Переопределяем
$.fn.addClass = function(){
var result = originalAddClassMethod.apply(this, arguments);
//Инициализируем событие смены класса
$(this).trigger('cssClassChanged');
return result;
}
})();
$(function(){
$("#test").bind('cssClassChanged', function(){
//Отработает, как только сменится класс
});
});
/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width: 320px)
and (max-device-width: 480px) {
/* Styles */
}
/* Smartphones (landscape) ----------- */
@media only screen
and (min-width: 321px) {
/* Styles */
}
/* Smartphones (portrait) ----------- */
@media only screen
and (max-width: 320px) {
/* Styles */
}
/* iPads (portrait and landscape) ----------- */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px) {
/* Styles */
}
/* iPads (landscape) ----------- */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: landscape) {
/* Styles */
}
/* iPads (portrait) ----------- */
@media only screen
and (min-device-width: 768px)
and (max-device-width: 1024px)
and (orientation: portrait) {
/* Styles */
}
/* Desktops and laptops ----------- */
@media only screen
and (min-width: 1224px) {
/* Styles */
}
/* Large screens ----------- */
@media only screen
and (min-width: 1824px) {
/* Styles */
}
/* iPhone 4 ----------- */
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
/* Styles */
}
<div class="roulette" style="display:none;">
<img src="http://example.com/star.png"/>
<img src="http://example.com/flower.png"/>
<img src="http://example.com/coin.png"/>
<img src="http://example.com/mshroom.png"/>
<img src="http://example.com/chomp.png"/>
</div>
<button class="start">START</button>
<button class="stop">STOP</button>
$(document).ready(function () {
var option = {
speed : 10,
duration : 3,
stopImageNumber : 0,
startCallback : function() {
console.log('start');
},
slowDownCallback : function() {
console.log('slowDown');
},
stopCallback : function($stopElm) {
console.log('stop');
}
}
$('div.roulette').roulette(option);
// START!
$('.start').click(function(){
$('div.roulette').roulette('start');
});
// STOP!
$('.stop').click(function(){
$('div.roulette').roulette('stop');
});
});
$(function(){
$('a[data-scroll^="#"]').click(function(){
$('.menu li').removeClass('active');
var target = $(this).attr('data-scroll');
$('html, body').animate({scrollTop: $(target).offset().top - 0}, 800);
return false;
});
});
var hide = false, show = true;
$(window).scroll(function() {
var scrollTop = $(window).scrollTop();
if (scrollTop >= 100 && !hide){
hide = true;
$('.navigation').stop()
.animate({"marginTop": "-210px"},"slow", function () {
show = false;
});
}
if (scrollTop < 100 && !show){
show = true;
$('.navigation').stop().animate({"marginTop": "+0px"}, "slow", function () {
hide = false;
});
}
});
<button id="open">Открыть</button>
<div id="form">
<form action="#" method="post">
<input type="text" value="" placeholder="найти" />
</form>
</div>
#form {
padding: 20px;
background-color: #000;
display: none;
}
$(document).ready(function () {
var searchBlock = $('#form');
$(document).on('click', '#open', function () {
searchBlock.slideToggle();
return false;
});
});
<div class="container">
</div>
var Test = React.createClass({
getInitialState: function() {
return {disabled: true};
},
clickHandlers: function() {
this.setState({disabled: false});
},
render: function() {
return (
<div>
<button disabled={this.state.disabled}>Тест</button>
<button onClick={this.clickHandlers}>Сменить</button>
</div>
);
}
});
React.renderComponent(Test({}), document.querySelector(".container"));
beforeSend: function() {
this.setState({
disabled: "disabled"
});
},
....
complete: function (){
this.setState({
disabled: "enable"
});
}
submitLogin: function() {
var that = this;
....
$.ajax({
....
beforeSend: function() {
that.setState({
disabled: "disabled"
});
},
....
complete: function (){
that.setState({
disabled: "enable"
});
},
....
})
....
}
(function (w, d) {
w.onload = function () {
var wrap = d.querySelector('#wrapper'), add = d.querySelector('button');
wrap.addEventListener('DOMNodeInserted', function(event) {
var target = event.target;
alert("На страницу был добавлен " + target.tagName);
}, false);
add.addEventListener('click', function (e) {
var el = d.createElement('iframe');
wrap.appendChild(el);
e.preventDefault();
}, false);
};
}(window, document));
window.onload = function () {
//Код
};
$(document).ready(function () {
//Код
});