0

タイトルは私が何をしようとしているのかをほぼ示していますが、もう少し詳しく説明するために、prochart-colitemJavaScriptが有効になっていないユーザー向けのクラスにCSSを適用したいと思います。

理由?列幅のパーセンテージを100%に設定してから、javascriptを使用して、追加された境界線の各divから2ピクセルを減算しています。

javascriptが有効になっていない場合、列と境界線は親divの100%を超えます。クラスから数ピクセルを差し引いて、親divにno-jsユーザーが収まるようにする必要があります。

これを行う簡単な方法はありますか?その中を試し<noscript>てみまし<style>たが、運が悪かったです。

4

4 に答える 4

6

これにアプローチする1つの方法は、特定のスタイルにしたい要素に常にCSSクラスを追加し、ロードしたらJavaScriptを実行して、そのクラスの要素からそれらのクラスを削除することです。

例として(ここでは簡単にするためにjQueryを使用していますが、これは明らかにJSライブラリなしで実行できます):

$(document).ready(function()
{
  $(".nonJsClass").each(function()
  {
    $(this).removeClass("nonJsClass");
  }
}

'nonJsClass'にCSSルールがあり、ユーザーがJSを有効にしていない場合にのみ適用されるようになりました。

于 2011-05-30T22:51:19.407 に答える
3

bodyタグにクラスを追加して、JSが有効になっていないときに目的のCSSをトリガーし、bodyタグの直後にJSで削除することができます。

したがって、JSをサポートしているユーザーには、特別なクラスの効果は表示されません。

于 2011-05-30T22:50:42.663 に答える
2

HTML5以前はnoscriptタグ内にスタイルシートを含めることはできませんでしたが、現在は可能です(ドキュメントの「先頭」に含める限り)。

http://adapt.960.gs/

JavaScriptが意図的に無効にされているか利用できない場合、スタイルシートのデフォルトはを介して提供できます。これはHTML5の場合に完全に有効です。

于 2012-02-03T09:37:22.937 に答える
1

scunliffeの答えは良いです。別の方法は、JavaScriptが有効になっている場合にのみ表示され、クラスチェーンを使用して、必要なdivのみを対象とするCSSスタイルを作成することです。

.prochart-colitem.js-enabled {
     /* your JS-specific styles */
}

次に、たとえばjQueryを使用して、そのクラスを追加できます。

$(document).ready(function() {
    $('.prochart-colitem').addClass('js-enabled');

});
于 2011-05-30T23:03:56.170 に答える