2016-05-26 5 views
1

これは私を少しばかげてしまいます。私は、にjQueryの.css()メソッドを使用して、を試して、クラスに必要な複数のフレックスボックス表示プロパティを設定しています。問題は、最後のものだけを保持することです。どのようにjQueryでこれを行うかについてのアイデア、またはそれは不可能ですか?jqueryで複数のCSS表示プロパティ値を設定するには

は、ここで私はこれまで試したものです:動作しません

$(".department-name").css({ 
    'display' : '-webkit-box', 
    'display' : '-webkit-flex', 
    'display' : '-moz-box', 
    'display' : '-ms-flexbox', 
    'display' : 'flex' 
}); 

が、それだけで最後のではなく他の人を取得します。私はページ上のテキスト要素を操作しています(高さ)、それを非表示にしたい(最初のCSS値)、それを操作してから、前に持っていたflexプロパティで表示します複数行の問題に対処するためにJSコードを変更し始めました。アイデア?変数に

答えて

2

ストアそれ:

var displayStyle = [ 
 
    'display: -webkit-box', 
 
    'display: -webkit-flex', 
 
    'display: -moz-box', 
 
    'display: -ms-flexbox', 
 
    'display: flex' 
 
].join(';'); 
 

 

 
$(document).ready(function() { 
 
    $(".department-name").attr('style', displayStyle); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<div class='department-name'>TEST</div>

0

ネヴァーマインド。その中には divというdisplayのプロパティを変更したので、問題を解決しました。h4があります。しかし、フィードバックをありがとう。

3
$('.department-name').addClass('test1'); 

CSS:

.test1{ 
    display : -webkit-box; 
    display : -webkit-flex; 
    display : -moz-box; 
    display : -ms-flexbox; 
    display : flex; 
} 

あなたの要素にテストクラスを追加するaddClass()メソッドを使用することができます。 css()のメソッドの表示プロパティがオーバーライドされている必要があり、最後のメソッドのみが適用されます。

+1

私の答えよりも明らかに優れています。これが行く方法です。 –

関連する問題