HTML按钮元素可切换页面上的CSS溢出

Question

As the title states I want to create a button which enables/disables overflow:hidden in the page. 如标题所示，我想创建一个按钮，该按钮在页面中启用/禁用溢出：隐藏。 and the default stance should be that the overflow:hidden is active and the page cant be scrolled. 且默认姿势应为“ overflow：hidden”处于活动状态且页面无法滚动。

I looked around for something similiar, didnt find anything. 我环顾四周，没有发现任何东西。

EDIT: 编辑：

Ok heres what I did with your help, having trouble linking the function to a button. 好的，这是我在您的帮助下所做的事情，无法将功能链接到按钮。 I might be miss understading something cause my skills in html and Jquery are limited. 我可能会错过一些不太了解的东西，因为我的html和Jquery技能有限。

After some research i got it to work by making the selector select an id and i gave the button and id. 经过一番研究，我通过使选择器选择一个ID使其起作用，我给出了按钮和ID。

    $(function (){
   $("#buttoni").on('click', function(e){
      e.preventDefault();
      $('body').toggleClass('no-scroll');
   });
});

and the button: 和按钮：

<button id="buttoni"> toggle scroll</button>

And that way i got it to work, im not sure what i missunderstood in the original to not get it to work but THANKS 这样我就可以正常工作了，我不确定我在原始版本中误解了什么，以使其无法正常工作，但是谢谢

Answer 1

how about 怎么样

.no-scroll{
   overflow:hidden;
}

and apply it to body 并将其应用于body

<body class="no-scroll">

and with jquery toggle it 并用jQuery切换它

$(function(){
   $('buttonid').on('click', function(e){
      e.preventDefault();
      $('body').toggleClass('no-scroll');
   });
});

HTML按钮元素可切换页面上的CSS溢出

问题描述

1 个解决方案

解决方案1
0 已采纳 2013-04-26 09:43:00

HTML按钮元素可切换页面上的CSS溢出

问题描述

1 个解决方案

解决方案1 0 已采纳 2013-04-26 09:43:00

解决方案1
0 已采纳 2013-04-26 09:43:00