1

leftCSS で疑似要素の CSS位置を変更しようとして:beforeいます。jQueryを使用してこのオブジェクトの位置を実際に変更できる場合、私が試したコードは効果がありません。:before css を使用する必要があります。

jsfiddle では、暗い灰色の正方形をその位置の右に 75px 移動しようとしています: http://jsfiddle.net/7RZkX/

コードは次のとおりです。

HTML

  <div id="box">
    <p class="boxText">TEST CONTENT</p>
  </div>

CSS

 #box{width:100px; background-color:#CCC; padding:30px 40px 30px 40px; position:relative; margin-top:120px;}
 .boxText{font-family: 'Trebuchet MS', Arial, Helvetica, sans-serif; font-size:16px; text-align:center;padding:0px;margin:0px;}
 p.boxText:before{content:"***"; background-color:#999; width:25px; height:15px; position:absolute; left:0px;top:-15px;z-index:20;}

jQuery

 $(function () {
      $('p.boxText:before').css({"position":"absolute", "top":"-15px","left":"75px"})
 });
4

2 に答える 2

1

$('p.boxText:before')空の jQuery でラップされたオブジェクトを返すため、別の CSS ルールを追加するだけです

p.boxText.move:before{ left:75px; }

そしてあなたのjsは

$(function () {
   $('p.boxText').addClass('move');
});

これを行うと、JavaScript とスタイルをより適切に分離できます。とにかく、疑似要素のみを中央に配置しようとしている場合は:before、javascript はまったく必要ありません。簡単に使う

p.boxText:before{
    content  : "***";
    ...
    width    : 25px;
    position : absolute; top: -15px; left: 50%; 
    margin-left: -12px; 
}
于 2013-01-23T10:50:16.770 に答える
0

これを試して：

JS: $(function () { $('p.boxText').addClass("me"); });

CSS: p.boxText.me:before{left:75px;}

于 2013-01-23T10:50:38.373 に答える