0

<div>リンクが入っているものと、最初のものの下<div>にあるものがあります。

最初のものを消したいので、次のようにします。

  • 2番目<div>は移動しません。したがって、jQuery関数.hide()は私が探しているものではありません。
  • リンクは最初のdivで非アクティブになります。

javascriptまたはjQueryを使用してそれを行うことは可能ですか？

PS：それが不可能な場合、私は他のオプションに興味があります：

  • 最初<div>は隠れます。
  • 2番目<div>は徐々に動きます。

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

コーラス

編集2：

このファイルhttp://jsfiddle.net/XKMEp/5/を見て、私が何をしようとしたかを確認できます。

編集：ここで私の試み

$("#div1").click(function() {       
    /*actus.fadeOut('slow');*/
    actus.fadeTo(1000,0).delay(1001).style.visibility = 'hidden';
    $('input,textarea,select,a', '#div1').attr("disabled", true);
});

これでも機能しません：

$("#div1").click(function() {       
    /*actus.fadeOut('slow');*/
    actus.fadeTo(1000,0).delay(1001).style.visibility = 'hidden';
    $('input,textarea,select,a', '#div1').attr("disabled", true);
});

そして、私のhtmlコードが次のようになっているとしましょう：

<div class="container">
    <div id="div1"></div>
</div>
    <div class="container">
<div id="div2"></div>
</div>


.container{width:300px;height:300px;}
4

6 に答える 6

1

divを同じサイズにすることもできますが、JavaScriptソリューションを使用する場合は、いつでもremoveAttr('href')リンクを無効にして不透明度を0に変更できます。これにより、divが削除されたように見えますが、 CSSを変更せずに同じ高さ。

$('#first').on('click', function() {
    $(this).css('opacity', '0');
    $(this).children('a').removeAttr('href');        
}​​​​​​​​);​

これがjsFiddleソリューションです。リンクをデータ属性やIDなどに保存すると、すべてを再度有効にすることもできます。

于 2012-11-01T05:29:23.867 に答える
0 
$('#second').css({"visibility":"hidden"});
  $('#firstdiv a').click(function(event){
    event.preventDefault();
      }             
);
于 2012-11-01T05:24:52.410 に答える
0

ここで私のデモを参照してください。2番目のdivの位置を移動する場合は、目標にstyle.visibilityを使用してstyle.displayを使用してください。（ただし、これは徐々にではありません）

<html>
<head>

<title>div test</title>

<script type="text/javascript">
function show(){
document.getElementById("div1").style.visibility = "visible";
document.getElementById("div1").style.display = "block";

}
function change1(){
document.getElementById("div1").style.visibility = "hidden";
}
function change2(){
document.getElementById("div1").style.display = "none";
}


</script>

</head>

<body>

<div id="div1" style="background:red; height:50px">
    first div: <a href="http://www.hetaoblog.com" target="_blank">a link to http://www.hetaoblog.com</a>
</div>

<div>
    2nd div    allaala   <br />
    <button onclick="show()">show</button>   <br />
    <button onclick="change1()">change1</button>   <br />
    <button onclick="change2()">change2</button>   <br />

</div>


</body>

</html>
于 2012-11-01T05:26:18.890 に答える
0

質問をよりよく理解するためにコードを追加できるかもしれません。

通常

style="display:none;" //will hide the div
style="display:block;" //will display the div

また

style="visibility:hidden" //will hide the div
style="visibility:visible" //will display the div

これらをトリガーするために、uはjavascriptを使用できます（ただし、最初にdivにはIDが必要です）

<script>
ns4 = (document.layers) ? true:false
ie4 = (document.all) ? true:false 
ng5 = (document.getElementById) ? true:false

// Works for all browsers irrespective of its release date :p

function hidediv() {
if (ng5) document.getElementById('div1').style.visibility = "hidden"
else if (ns4) document.div1.visibility = "hide"
else if (ie4) div1.style.visibility ="hidden"
}

function showdiv(n){
if (ng5) document.getElementById('div1').style.visibility = "visible";
else if (ns4) document.div1.visibility = "show";
else if (ie4) div1.style.visibility = "visible";
</script>

関数を呼び出してdivを表示/非表示にします

于 2012-11-01T05:27:28.703 に答える
-1

修正...あきらめていませんでした。はい、位置を維持するには不透明度（クロスブラウザの場合は不透明度までフェード）である必要がありますが、jqueryの1行でそれが行われます。http://jsfiddle.net/calder12/XKMEp/24/

あなたがしなければならないのは、fermerをdivではなくタグに変更し、それらを少しスタイル変更して、それらを持っていた場所に配置することです。

    $(".fermer").click(function() {
    $(this).closest('div').fadeTo('slow',0);
    });
​

     <a href="#" class="fermer">
         fermer
     </a>
于 2012-11-01T05:19:55.350 に答える
-1

このタイプの構造を使用する

<div id="main">
 <div id="first">
   <a href="javascript:void(0);" id="link">Hide</a>
</div>
<div id="second">
 content
</div>
</div><!-- Main div -->

Jquery

 $("#link").click(function() {
  $("#first").hide();
});
于 2012-11-01T05:20:35.460 に答える