根据窗口宽度执行jQuery函数

时间:2016-03-27 07:32:58

标签: jquery resize width smooth-scrolling

我有一个jQuery函数,我只想在浏览器窗口具有最小宽度时执行(该功能是在页面上的内部链接之间上下移动时添加平滑的滚动效果,但会干扰菜单我试图在宽度小于最小宽度时habiliate,我几乎得到它与下面的行,当页面加载和窗口调整大小时执行,当我从子最小宽度传递时它很好(不 - 效果)超过最小宽度(效果),但不是当向后(从效果到无效)。就像有些缺失,删除else语句中的前一个代码或变量的指令,但我不知道是什么。这里是jQuery代码:



// the code has 3 detection modes for the width of the browser so it is repeated 3 times

$(window).on("load resize",function(){
  if (self.innerWidth > 996) { //first detection mode
    $('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;
        }
      }
    });
  }
  else {
    // here some instruction that reset values or something that provoke that
    // previous code, loaded when window is > 996 don't be active when window < 996
  }
});

$(window).on("load resize",function(){
  if (document.documentElement && document.documentElement.clientWidth > 996) { //second detection mode
    $('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;
        }
      }
    });
  }
  else {
    // here some instruction that reset values or something that provoke that
    // previous code, loaded when window is > 996 don't be active when window < 996
  }
});

$(window).on("load resize",function(){
  if (document.body > 996) { //third detection mode
    $('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;
        }
      }
    });
  }
  else {
    // here some instruction that reset values or something that provoke that
    // previous code, loaded when window is > 996 don't be active when window < 996
  }
});
&#13;
&#13;
&#13;

为我解决了!

我通过做一些我必须在初学时做过的事来解决这个问题,但是我暂时的无知(我正在学习)让人很难看到。简单地说,我将效果限制在id =&#34; content&#34;并且没有对所有页面(包括菜单)执行此操作我在第一行指定此项。

&#13;
&#13;
$('#content 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;
    }
  }
});
&#13;
&#13;
&#13;

对不起相对浪费时间,无论如何我上面定义的内在问题是真实的,我在这个网站上看到了一个非常相似的问题的其他帖子;当从无活动(在小窗口中)传递到活动(在大窗口中)时效果激活但在从活动(在大窗口中)传递到无活动(在小窗口中)时没有停用,并且没有答案。

1 个答案:

答案 0 :(得分:0)

您有3个函数附加到同一个事件侦听器。使用if else语句尝试一个函数。类似的东西:

protected String doInBackground(String... params){

    final String SERVER_HOSTNAME = "hereGoesMyIP";
    final int SERVER_PORT = 2002;
    BufferedReader mSocketReader;
    PrintWriter mSocketWriter;
    final String TAG = ClientSide.class.getSimpleName();
    String outputln = "Me. Android";


    try {
        //Initialization of the socket, socket reader and writer.
        Socket socket = new Socket(SERVER_HOSTNAME, SERVER_PORT);
        mSocketReader = new BufferedReader(new InputStreamReader(socket.getInputStream()));
        mSocketWriter = new PrintWriter(new OutputStreamWriter(socket.getOutputStream()));
        System.out.println("Connected to server " + SERVER_HOSTNAME + ":" + SERVER_PORT);


        //An infinite loop which checks for incoming messages.
        while(true){
            String inMsg="";
            String aMessage = "";

            //Reads from the socket
            if((inMsg=mSocketReader.readLine())!=null && socket.isConnected()){
                publishProgress(inMsg);
            }

            Thread.sleep(500);//still requres try - catch?
        }


    } catch (IOException ioe) {
        System.err.println("Cannot connect to " + SERVER_HOSTNAME + ":" + SERVER_PORT);
        ioe.printStackTrace();

    }

    return null;
}