web-dev-qa-db-ja.com

jQuery：cssの可視性：非表示の場合、要素をどのように表示できますか？

私のCSSで、いくつかの要素をvisibiliy：hiddenに設定しましたが、どうすればそれらを表示できますか？

私は以前に不透明でそれを行いましたが、IEにいくつかのバグがあります：

var i = 0;
$mySelection.each(function(i) {
    $(this).delay((i * 100) + ($mySelection.length)).animate(
        { opacity: "1"},
        {queue:true, duration:1000, easing:"quartEaseIn"}
    ); 
})

不透明度の代わりにjQueryを使用して制御可能な可視性が必要な場合はどうすればよいですか？ありがとうございました

jqueryvisibilityopacity
11
davidino
$(":hidden").css("visibility", "visible");
37
karim79

visibility: hiddenを使用するのではなく、display:noneを使用し、非表示の要素をフェードインする場合は fadeIn を使用します。例えば：

$("div:hidden").fadeIn("slow");

編集：可視性を使用したい場合は、次のことを試してください。

var i = 0;
$mySelection.each(function(i) {
    $(this).delay((i * 100) + ($mySelection.length)).css(
        { 'opacity': '0', 'visibility': 'visible'}).animate(
            { opacity: "1"},
            {queue:true, duration:1000, easing:"quartEaseIn"});
});
3
cspolton

このコードを使用して、JqueryでCSSの可視性属性を変更しました。ホバーのelement1がelement2の可視性を変更する場所。

マウスオーバーマウスリーブ効果を与えるために、同じ要素に対して2つの異なるスクリプトを実行しました。

 <script>$(document).ready(function(){
 $(".element1").mouseover(function(){
     $(".element2").css("visibility","visible");
 });

}）;

         <script>$(document).ready(function(){
 $(".element1").mouseleave (function(){
     $(".element2").css("visibility","hidden");
 });

}）;

注.-CSSが影響を受けているElement2は、元々非表示になっています。したがって、マウスがElement1の上にあると、Element2が表示されます。マウスがelement1を離れると、Element2は再び非表示になります。それが役に立てば幸い

-スタックオーバーフローでユーザーからの他のコードを再調査および混合するこのコードの有効期限

2
JasoBeam 777