<body>
//= templates/header.html
<div>
...
</div>
//= templates/footer.html
</body>.nav-service {
padding: 0;
margin: 0;
list-style: none;
position: relative;
}
.nav-service li {
float: left;
margin-left: 10px;
}
.sub-menu {
position: absolute;
top: 20px;
left: 0px;
visibility: hidden;
opacity: 0;
transition: all ease 0.2s
}
.active+.sub-menu {
visibility: visible;
opacity: 1;
}$('.nav-button').click(function(e) {
e.stopPropagation();
e.preventDefault();
$('.nav-button').not(this).removeClass('active');
$(this).addClass('active').next().delay(200).show();
});
$('html, .close').click(function() {
if ($('.nav-button.active').length > 0) {
$('.nav-button').removeClass('active').next().delay(200).hide()
}
});$( ".type,.price,.params,.params2" ).hover(function() {
$( this ).addClass( "gray" );
}, function() {
$( this ).removeClass( "gray" );
}
);
<table class="table">
<tbody>
<tr>
<td></td>
<td></td>
</tr>
</tbody>
</table><table class="table table-striped">
<tbody>
<tr>
<td></td>
<td></td>
</tr>
</tbody>
</table><table class="table table-bordered">
<tbody>
<tr>
<td></td>
<td></td>
</tr>
</tbody>
</table><table class="table table-hover">
<tbody>
<tr>
<td></td>
<td></td>
</tr>
</tbody>
</table><table class="table table-condensed">
<tbody>
<tr>
<td></td>
<td></td>
</tr>
</tbody>
</table>$(window).bind('scroll',function(e){
parallaxScroll(); // при скролле вызываем нашу функцию
});
function parallaxScroll(){
var scrolled = $(window).scrollTop(), // определяем текущее положение скролла
backgroundPositionByX = "0", // позиция фона по горизонтали (не двигаем)
backgroundPositionByY = (1250 - (scrolled * .4))+'px', // позиция фона по вертикали (тут можно пошаманить с формулой - стартовое положение фона минус текущее положение скролла, умноженное на 0.4) 0.4 - влияет на скорость поднятия вверх или вниз
backgroundPosition = backgroundPositionByX +" "+ backgroundPositionByY; // для фаерфокса нужно указывать оба значения, он не понимает свойство background-position-y, но хавает background-position
$('блок_с_фоном').css('background-position', backgroundPosition);
}position: relative;position: absolute;
z-index: 100;// Ловишь событие движение слайдера (у некоторых слайдеров есть события)
$('slider').on('sliderMove', function() {
// Вешаешь на кнопочку заранее написанную анимацию
$('кнопка').addClass('doAnimation');
SetTimeOut(function(){
// Через пол секунды удаляешь анимацию кнопки
$('кнопка').removeClass('doAnimation');
}, 500);
});@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
/* Ваш css код */
}