angular1当前页滚动与导航

末蓝、 2023-06-05 08:22 23阅读 0赞

//仅供作者自己观看
    .module('module-set')
        .run(function ($anchorScroll) {
          $anchorScroll.yOffset = 165;
        })
    $scope.value = 'set_visit';
    $scope.init = function () {
      tradeApi
        .query({
          method: 'get',
          root: 'settings',
          url: '/secset/get_indexdata',
        })
        .then(function (res) {
          $scope.current_config = res;
        });
    
      $(window).on('scroll', function () {
        var top_set_visit = $('#set_visit')[0].getBoundingClientRect().top;
        var top_safe_store_set = $('#safe_store_set')[0].getBoundingClientRect().top;
        var top_device_state_alarm_threshold_set = $('#device_state_alarm_threshold_set')[0].getBoundingClientRect().top;
    
        if (top_device_state_alarm_threshold_set < 166) {
          $scope.value = 'device_state_alarm_threshold_set';
          return;
        }
    
        if (top_safe_store_set < 166) {
          $scope.value = 'safe_store_set';
          return;
        }
    
        if (top_set_visit < 166) {
          $scope.value = 'set_visit';
          return;
        }
    
      });
    
    };
    
    $scope.set = function (value) {
      if (value === 'set_visit') {
        $scope.value = 'set_visit';
        $location.hash('set_visit');
      } else if (value === 'safe_store_set') {
        $scope.value = 'safe_store_set';
        $location.hash('safe_store_set');
      } else if (value === 'device_state_alarm_threshold_set') {
        $scope.value = 'device_state_alarm_threshold_set';
        $location.hash('device_state_alarm_threshold_set');
      }
      $anchorScroll();
    };
    
    <div class="set-safe" ng-init="init()">
      <ul class="left">
        <li ng-class="{actived:value==='set_visit'}" ng-click="set('set_visit')">设置访问 </li>
        <li ng-class="{actived:value==='safe_store_set'}" ng-click="set('safe_store_set')">
          安全存储设置</li>
        <li ng-class="{actived:value==='device_state_alarm_threshold_set'}"
          ng-click="set('device_state_alarm_threshold_set')">设备状态告警阈值设置</li>
      </ul>
      <div class="right">
        <dir-title title="访问设置" id="set_visit" style="margin-top:0;"></dir-title>
        <dir-title title="安全存储设置" id="safe_store_set"></dir-title>
        <dir-title title="设备状态告警设置" id="device_state_alarm_threshold_set"></dir-title>
      </div>
    </div>

转载于:https://www.cnblogs.com/gushixianqiancheng/p/11570725.html