zoukankan      html  css  js  c++  java
  • 用户资料选项卡

    最近在项目中用到了一个类似于微博的用户资料选项卡的功能,其实就是计算8个位置的坐标点

    var screenW = $(window).width(),

      screenH = $(window).height(),

      domL = dom.offset().left,

      domT = dom.offset().top,

      domW = dom.outerWidth(),

      domH = dom.outerHeight(),

      usercardW = $("#usercard").outerWidth(),

      usercardH = $("#usercard").outerHeight(),

      scrollL = document.documentElement.scrollLeft || document.body.scrollLeft || 0,

      scrollT = document.documentElement.scrollTop|| document.body.scrollTop || 0;

    if(domL + scrollL < (screenW - 1000)/2 + 200){

      if(screenH /2 < domT - scrollT){

         return {top: domT + domH - usercardH + 'px', left : domL + domW + 'px'}

      }else{

         return {top: domT + 'px', left : domL + domW + 'px'}

      }

    }else if(domL + scrollL > screenW/2 + 200){

        if(screenH /2 < domT - scrollT){

         return {top: domT + domH - usercardH + 'px', left : domL - usercardW + 'px' }

      }else{

        return {top: domT + 'px', left : domL - usercardW + 'px'}

      }

    }else{

       if(screenH /2 < domT - scrollT){

        if(domL + scrollL < screenW/2){

           return {top: domT - usercardH + 'px', left : domL + 'px'}

        }else{

           return {top: domT - usercardH + 'px', left : domL + domW - usercardW + 'px'}

        }

      }else{

         if(domL + scrollL < screenW/2){

          return {top: domT + domH + 'px', left : domL + 'px'}

        }else{

          return {top: domT + domH + 'px', left : domL + domW - usercardW + 'px'

        }

      }

    }

  • 相关阅读:
    [ PyQt入门教程 ] Qt Designer工具的使用
    [ PyQt入门教程 ] PyQt5开发环境搭建和配置
    Notepad++提升工作效率小技巧
    思考:测试人员如何快速成长
    Linux /tmp目录下执行脚本失败提示Permission denied
    使用Quartz实现定时任务
    算法篇(前序)——Java的集合
    深入理解 JVM(上)
    Linux集锦
    秒杀系统实现高并发的优化
  • 原文地址:https://www.cnblogs.com/xiaohui108/p/2313463.html
Copyright © 2011-2022 走看看