淘先锋技术网

首页 1 2 3 4 5 6 7

在网页中,有时候需要在一个元素上点击后使它固定在页面的某个位置,接下来我们介绍如何使用jQuery实现这一功能。

jquery点击悬浮固定位置

首先,我们需要选定需要固定的元素,在这个元素上绑定点击事件。比如,我们选定一个id为“fixedDiv”的div元素:


$('#fixedDiv').click(function() {

});

接着,在事件函数中,我们需要设置该元素的css属性,使其固定到页面的某个位置。这里我们以顶部固定为例,设定元素的position属性为fixed,top属性为0:


$('#fixedDiv').click(function() {
  $(this).css({
    'position': 'fixed',
    'top': '0'
  });
});

这样点击元素后,它就会被固定在页面的顶部了。

需要注意的是,固定元素的父元素需要设置position属性为relative,否则固定元素将会相对于页面移动而不是相对于父元素。