1

cssコードで使用nth-childしていますが、IE 8では機能しません。IE8では処理できないことはわかっていnth-childますが、機能させる方法を見つける必要があります。

これが私のコードです：

.paypalshop .shop-groups li:nth-child(1){
  float:left;
  border: 1px solid #ccc;
  width:200px;

   }

.paypalshop .shop-groups li:nth-child(2){
  float:left;
  border: 1px solid #ccc;
  width:150px;
   }

.paypalshop .shop-groups li:nth-child(3){
  float:left;
  border: 1px solid #ccc;
  width:210px;
   }

.paypalshop .shop-groups li:nth-child(4){
  float:left;
  border: 1px solid #ccc;
  width:200px;
   }

.paypalshop .shop-groups li:nth-child(5){
  float:left;
  border: 1px solid #ccc;
  width:70px;
   }

.paypalshop .shop-groups li:nth-child(6){
  float:left;
  border: 1px solid #ccc;
  width:105px;
   }

.paypalshop .shop-groups li:nth-child(7){
  float:left;
  border: 1px solid #ccc;
  width:154px;
   }

.paypalshop .shop-groups li:nth-child(8){
  float:left;
  border: 1px solid #ccc;
  width:130px;
   }   

.paypalshop .shop-groups li:nth-child(9){
  float:left;
  border: 1px solid #ccc;
  width:220px;
   }
.paypalshop .shop-groups li:nth-child(10){
  float:left;
  border: 1px solid #ccc;
  width:220px;
   }

nth-childしたがって、必要なのは、IE 8で関数を機能させる方法を見つけることです。IE8で機能させるために使用できるjQueryメソッドはありますか？

ありがとうございました！

4

2 に答える 2

4

はい：nth-​​childセレクターを使用します

http://api.jquery.com/nth-child-selector/

cssの変更で

http://api.jquery.com/css/

例えば

$("paypalshop .shop-groups li:nth-child(2)").css("width":"150px","float":"left","border":"1px solid #ccc");
于 2012-08-01T18:59:00.837 に答える
0

jQueryでCSSを変更する（ページの読み込みに80kbを追加し、WebサイトのレイアウトにJavaScriptを依存させる）代わりに、それぞれにクラスを追加してみませんliか？

HTML：

<ul>
    <li class="normal"><!-- 200px --></li>
    <li class="narrow"><!--- 70px --></li>
    <li class="wide"><!-- 220px --></li>
    ...
</ul>

CSS：

li { float: left; border: 1px solid #ccc; }
li.normal { width: 200px; }
li.narrow { width: 70px; }
li.wide { width: 220px; }

Imo、これはよりクリーンで読みやすいソリューションであり、保守が容易であり、現在使用されていると思われるすべてのブラウザーの問題を解決します。

于 2012-08-02T09:24:57.547 に答える