Javascript 同时选择大字体和低视觉css样式表_Javascript_Jquery_Html_Css_Web

Javascript 同时选择大字体和低视觉css样式表

javascript jquery html css web

Javascript 同时选择大字体和低视觉css样式表,javascript,jquery,html,css,web,Javascript,Jquery,Html,Css,Web,我在设计我的第一个网站的过程中，我陷入了以下问题。我有3个样式表：一个用于低视力；一个用于大字体，另一个用于默认字体。我有3个按钮来选择这些，但我一次只能选择一个。我想知道是否有可能同时选择2，即低视野和大字体，或者我需要创建第四个样式表这是我的 <link rel="stylesheet" type="text/css" href="css/style.css" title="default" /> <link rel="stylesheet" type="text/css

我在设计我的第一个网站的过程中，我陷入了以下问题。我有3个样式表：一个用于低视力；一个用于大字体，另一个用于默认字体。我有3个按钮来选择这些，但我一次只能选择一个。我想知道是否有可能同时选择2，即低视野和大字体，或者我需要创建第四个样式表

这是我的

<link rel="stylesheet" type="text/css" href="css/style.css" title="default" />
<link rel="stylesheet" type="text/css" href="css/large_font.css" title="large_font"     disabled />
<link rel="stylesheet" type="text/css" href="css/low_vision.css" title="low_vision" disabled />

<script type="text/javascript" src="js/styleswitch.js"></script>
<script type='text/javascript' src='js/jquery.min.js'></script>
<script type='text/javascript' src='js/jquery.scrollTo-min.js'></script>
<script type='text/javascript' src='js/jquery.localscroll-min.js'></script>
<script type="text/javascript">
$(document).ready(function () {
$.localScroll();
});
</script> 

<link rel="stylesheet" href="css/slimbox.css" type="text/css" media="screen" /> 
<script type="text/JavaScript" src="js/slimbox.js"></script> 

</head>

<body>

<div id="background">

<div id="wrapper">
    <div id="accessibility">
            <ul id="access_list">
                <li><a href="#" onclick="setActiveStyleSheet('default'); return false;">Default</a> | </li>
                <li><a href="#" onclick="setActiveStyleSheet('large_font'); return false;">Large Font</a> | </li>
                <li><a href="#" onclick="setActiveStyleSheet('low_vision'); return false;">Low Vision</a></li>
            </ul>
        </div>
    <div id="header">
        <div id="site_title"><a href="#">Sean's Site</a></div>

    </div>


$（文档）.ready（函数（）{
$.localScroll（）；
});

|
|

如果我理解正确，您希望有选择地启用/禁用每个样式表，而不是选择其中一个作为“活动样式表”

为此，请首先为样式表提供唯一的ID：

<link rel="stylesheet" type="text/css" href="css/style.css" id="default" />
<link rel="stylesheet" type="text/css" href="css/large_font.css" id="large_font"     disabled />
<link rel="stylesheet" type="text/css" href="css/low_vision.css" id="low_vision" disabled />

现在，您可以在界面中使用该功能：

<ul id="access_list">
  <li><a href="#" onclick="toggleStylesheet('default')">Default</a></li>
  <li><a href="#" onclick="toggleStylesheet('large_font')">Large Font</a></li>
  <li><a href="#" onclick="toggleStylesheet('low_vision')">Low Vision</a></li>
</ul>

关于

toggleStylesheet

函数的更多信息，请参见本问答：

不明白您在说什么，抱歉，我只是尝试使用javascript同时运行2个css样式表，但我无法理解，因此我正在寻找任何可能的帮助。但是当您在一个页面上添加任何css时，它将始终运行所有css。也就是说，如果页面上有20个css，那么它也会运行所有css。我知道是的，但我已经设置好了，这样我可以通过javascript在不同的样式表之间切换，以满足视力受损者的可访问性要求。我只想能够同时激活2。可访问性div就是发生这种情况的地方！

<ul id="access_list">
  <li><a href="#" onclick="toggleStylesheet('default')">Default</a></li>
  <li><a href="#" onclick="toggleStylesheet('large_font')">Large Font</a></li>
  <li><a href="#" onclick="toggleStylesheet('low_vision')">Low Vision</a></li>
</ul>