Media Queries


/* 6. Media Queries */
@media(max-width: 1888px) {

}

@media(max-width: 1733px) {

}

@media(max-width: 1570px) {

}

@media(max-width: 1414px) {

}

@media(max-width: 1250px) {

}

@media(max-width: 1025px) {

}


@media(max-width: 990px) {
}

@media(max-width: 850px) {
	
}

@media(max-width: 767px) {

}

@media(max-width: 590px) {
	
}

@media(max-width: 570px) {

}

@media(max-width: 400px) {

}

Адаптивный сайт



jQuery(document).ready(function(){
    
    devWidthTest();

});


function devWidthTest(){
var width = window.innerWidth;
//var width = document.documentelement.clientWidth;
console.log(width);
if (width > 1200 ) {jQuery('body').addClass('dw-lg').removeClass('dw-md').removeClass('dw-sm').removeClass('dw-xs');};
if (width <= 1200 && width > 992) {jQuery('body').removeClass('dw-lg').addClass('dw-lg').addClass('dw-md').removeClass('dw-sm').removeClass('dw-xs');};
if (width <= 992 && width > 768) {jQuery('body').removeClass('dw-md').removeClass('dw-lg').addClass('dw-md').addClass('dw-lg').addClass('dw-sm').removeClass('dw-xs');};
if (width <= 768) {jQuery('body').removeClass('dw-md').removeClass('dw-sm').removeClass('dw-lg').addClass('dw-md').addClass('dw-sm').addClass('dw-md').addClass('dw-lg').addClass('dw-xs');};

 window.onresize = function(event) {
devWidthTest();
};






.container960 {width:960px!important; margin: 0 auto;}
.dw-lg .container960 {}
.dw-md .container960 {width: 992px!important;}
.dw-sm .container960 {width: 768px!important;}
.dw-xs .container960 {width: 100%!important;padding: 0px 0px;}




табы

Заготовка для табов

 

  • 1
  • 2
  • 3
  • 4