有效地使用Enquire.js和媒体查询为jquery动画

嗨，我一直在试图让我的头围绕如何使用enquire.js。我使用.mouseenter（function（）来激活函数.show和.hide。但是当你在平板电脑上查看它时，移动.mouseenter变得多余。我想告诉jquery在屏幕宽度达到我的屏幕时显示div 。媒体查询有效地使用Enquire.js和媒体查询为jquery动画

@media only screen and (min-width : 769px) and (max-width : 959px)

下面是一个例子

这里是我的jQuery：

$(".slidingDiv_how").hide(); 
      $(".show_sub").show(); 

      $('.show_sub').mouseenter(function(){ 
      $(".slidingDiv_how").slideDown(); 
      return false; 
      }); 
      });

这里是我的html

<div class"right-wrapper"><!--How wrapper --> 
           <div id="how_we" class="show_sub1" style="cursor: hand; cursor: pointer;"> 
            <h1><a href="#">How We Work:</a></h1> 
             <div class="slidingDiv_how"> 
              <p class="show_sub1">The heat of the vertical rays of the sun was fast making our horrible prisons unbearable, so that after passing a low divide, and entering a sheltering forest, we finally.</br> 
       www.dochouse.co.uk</p> 

             </div> <!-- end slidingdiv2 -->

我已阅读文档，并不真正了解要放置哪个部分。任何帮助将非常感激。

来源

2013-03-13 user2086702

希望这有助于，几乎从最新的版本

V2.0.0（2013年4月17日）

听和火docs
enquire.register("screen and (min-width : 769px) and (max-width : 959px)", { 
    match : function() { 
     $(".slidingDiv_how").show();    
    }, 
    unmatch : function() { 
     $(".slidingDiv_how").hide(); 
    } 
}).listen(); 
其变化直接复制从v2开始不再需要，并且从API中删除了。删除代码中的任何用法都是必需的。此外，由于查询不再依赖调整大小事件，您必须确保您的polyfill支持matchMedia.addListener。的详细信息可以在旧版浏览器部分找到。

来源

2013-03-29 10:56:43

有效地使用Enquire.js和媒体查询为jquery动画

回答

相关问题