媒体查询已停止工作

时间:2015-09-30 13:26:05

标签: css responsive-design media-queries

我的媒体查询已停止工作,我不知道为什么。他们昨天工作正常。我认为存在冲突,但不知道在哪里。我将非常感谢您的帮助!

目前支持的解决方案: 1024×768 1280×720 1440 1600×900 1920×1080

现场演示:http://dev.studiowonderland.pl/demo/index.html

@EDIT - 当文件在服务器上时,一切正常。在当地它没有工作......

CSS:

.logo {
    background: url('../img/logo.png')no-repeat;
    width: 600px;
    height: 188px;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    top: 3%;
    left: 0;
    right: 0;
}

.doors {
    background: url('../img/doors.png') no-repeat;
    position: absolute;
    top: 50%;
    left: 50%;
    width: 1000px;
    height: 667px;
    margin-top: -275.5px;
    margin-left: -525px;
}

#user_go {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -275.5px;
    margin-left: -525px;
}

.ramka {
    background: url('../img/ramka.png') no-repeat;
    position: absolute;
    top: 50%;
    right: 10%;
    width: 394px;
    height: 700px;
    margin-top: -350px;
}

.menu {
    position: absolute;
    bottom: 0;
    left: 10%;
}

以下是媒体查询的示例:

 @media screen and (max-width: 1440px) and (max-height: 900px) and (min-height:300px) {

.ramka, .doors, .logo, .belka {
    background-size: 85% 85% ;
}

.menu {
    top: 125px;
    left: 7%;
}
.doors {
    margin-top: -225.5px !important;
    margin-left: -475px;
}

.ramka {
    margin-top: -250px !important;
    margin-right: -75px;
}
ul.nawigacja {
    list-style: none;
    padding-top: 30px;
}

ul.nawigacja li {
    margin: 40px 10px;
}
ul.nawigacja li:nth-child(1) {
    margin-right: 65px;
}

ul.nawigacja li:nth-child(2) {
    margin-right: 175px;
    margin-top: 45px;
}
ul.nawigacja li:nth-child(3) {
    margin-left: 15px;
    margin-top: -15px;
}

ul.nawigacja li:nth-child(4) {
    margin-top: 10px;
    margin-right: 105px;
}

ul.nawigacja li:nth-child(5) {
    margin-top: 60px;
    margin-left: -15px;
}
ul.nawigacja li  a{
    font-size: 2em;
}
}

还有JS:

$(document).ready(function(){

// Cookies do Dialogu //


if ($.cookie("dismiss") == null) {

  $('#myModal').appendTo("body");
  function show_modal(){
    $('#myModal').modal();
  }

  window.setTimeout(show_modal, 500);
  }

$(".dismiss").click(function() {
    document.cookie = "dismiss=true; expires=Fri, 31 Dec 9999 23:59:59 UTC";
});



// Smooth Scrolling //

$(function() {
  $('a[href*=#]:not([href=#])').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
      if (target.length) {
        $('html,body').animate({
          scrollTop: target.offset().top
        }, 1000);
        return false;
      }
    }
  });
});


// OBRAZEK NA DRZWIACH //

$('.doors').hover(function(){
    $(this).after(' <img id="user_go" src="img/logo2.png" />');

    },function () {
    $("#user_go").remove();
});

});

0 个答案:

没有答案