css - 如何在单击按钮时激活/停用 CSS？

Question

我的网站是:http://test.highfieldscentre.ac.uk/wordpress/

我正在尝试为其添加一个辅助功能，使访问者可以单击一个按钮来“打开”和“关闭”高对比度模式(即带有黄色文本的黑色背景)。我有这个的 CSS，但我不确定如何制作它以便打开和关闭它。

非常感谢任何帮助!

Answer 1

更好的方法可能是使用 jQuery 的 .toggleClass() 函数将一个类附加到您的 body 中，如下例所示:

https://jsfiddle.net/Lc2z4hj3/

这里我们有一个元素，点击它可以打开和关闭 contrast 类。从那里您可以根据需要修改您的 CSS 以提供标准/高对比度选项。

必要的 jQuery 示例在 Fiddle 和下面:

$(function() {
    $(".toggleContrast").click(function() {
       $('body').toggleClass('contrast');
  })
});