如果'X'div可見，'Y'div被隱藏。如果'X'Div隱藏，'Y'div可見

我正在建立一個網站，並有一個幻燈片。幻燈片具有標題，並有一個覆蓋整個頁面的索引。當疊加層被激活時，字幕需要消失。當疊加層被停用時，通過單擊退出按鈕或縮略圖鏈接或菜單鏈接，字幕必須返回。如果'X'div可見，'Y'div被隱藏。如果'X'Div隱藏，'Y'div可見

這是我迄今爲止

if($('#indexpage').css('display') == 'none'){ 
    $('#imageinfo').css('visibility') == 'visible'} 
    else { 
    $('#imageinfo').hide('slow'); 
    }

我不能爲我的生命，弄清楚如何得到它的工作。任何幫助將不勝感激。

感謝，

來源

2012-01-24 Josh Jarvis

這可能很難做到，但這個問題的標題非常模糊。你能想出一個更好的一個，以便其他人在遇到同樣的問題時可能受益？ –

if($('#indexpage').css('display') == 'none') 
$('#imageinfo').show('slow'); 
else 
$('#imageinfo').hide('slow');

來源

2012-01-24 05:22:30 Ashraf

你可以使用selector.is（「：可見」），像這樣：

if ($("#x").is(":visible")) { 
    $("#x").hide("slow"); 
    $("#y").show("slow"); 
} else 
    if ($("#y").is(":visible")) { 
     $("#y").hide("slow"); 
     $("#x").show("slow"); 
    }

Live demo

來源

2012-01-24 05:24:16 ComputerSaysNo

謝謝，沒有工作。這些都沒有。也許某些地方與其他插件衝突。無論如何感謝 –

假設visibility是你Cssclass然後嘗試

$('#imageinfo').addClass('visibility').show('fast');

來源

2012-01-24 05:26:48

鑑於你的解釋，你的代碼的第二行：

$('#imageinfo').css('visibility') == 'visible'

似乎試圖設置'visibility' CSS屬性，但它實際上做的是比較該值以字符串'visible'相關的電流值，而且這個比較的結果並沒有被用於任何事情。即使將等號比較運算符==替換爲賦值運算符=，它仍然不正確，因爲嘗試將該函數的返回值指定爲字符串沒有意義。正確的語法變化屬性如下：

$('#imageinfo').css('visibility', 'visible');

但你也可以使用.show()作爲.hide()相反。所以：

if($('#indexpage').css('display') == 'none'){ 
    $('#imageinfo').show('slow'); 
} else { 
    $('#imageinfo').hide('slow'); 
}

至於配件，在與你有任何其他的代碼，我首先需要看你的其他代碼，你具體怎麼設置你的事件處理程序。

來源

2012-01-24 05:29:08 nnnnnn

在你的代碼，它控制顯示或一個元素或其他的隱藏，你只需要使用.toggle()：

$("#indexpage,#imageinfo").toggle();

則每次.toggle()被調用，一個是可見的將被隱藏，而一個隱藏的將是可見的。

這假定你已經設置你的CSS有一個顯示，其他默認情況下隱藏。所以，你的頁面的CSS應該包含：

#indexpage { 
    display: none; 
}

如果不爲你工作，你仍然要顯示或隱藏基於對方是否是可見的一個，使用.toggle()傳遞指示是否顯示或隱藏元素的布爾參數。使用.is()和:visible獲取該布爾值。

$("#imageInfo").toggle(!$("#indexpage").is(":visible"));

編輯：只是要注意，有一對夫婦的您的例子不工作的原因。

首先，您似乎試圖使用.hide()與.css("visibility")。但是，.hide()將元素的display設置爲none。一旦設置，visibility值將不起作用。 .hide()的必然結果是.show()。但有時可能優選.toggle()，因爲它封裝了.hide()和.show()的功能。當您想要根據特定條件顯示或隱藏元素時，尤其如此。在這種情況下，將一個布爾值傳遞給.toggle()，指出該元素是否應該可見。你可以從這個降低代碼：

if (checkSomeCondition()) { 
    $("#myElement").show(); 
} 
else { 
    $("#myElement").hide(); 
}

到代碼中添加一行：

$("#myElement").toggle(checkSomeCondition());

其次，你的代碼失敗的另一個原因是，你正在評估visibility的值而不是分配可見性值。 ==運算符是相等運算符，用於比較兩個值並返回布爾值。要分配一個值，你需要使用賦值運算符（=）：

var a = 1; 
a == 2; // returns false, a is unchanged 
a = 2; // now a is 2

但是，你也不會在這種情況下使用賦值操作符，因爲你不能將值分配給的結果函數調用。即，someFunction() = 1是無效的JavaScript。在jQuery中，要讀取值，可以使用單個參數。要編寫一個值，你傳遞第二個參數，指示新值：

$('#imageinfo').css('visibility', 'visible');

這糾正語法，但由於上面的第一個問題，它不能解決你的問題 - 你需要設置display而不是visibility。

來源

2012-01-24 05:42:54 gilly3

如果你喜歡單行的解決方案，你可以嘗試：

$('#y').css('display', $('#x').is(':visible') ? 'none' : 'block');

來源

2012-01-24 05:47:50 techfoobar

或者更短：'$（'＃y'）[$（'＃x'）。is（'：visible'）？「hide」：「show」]（）;' – nnnnnn

+2 - sweet。我不知道我們可以將func名稱作爲字符串。即直到我看到[]訪問你的方式已經使用..很酷.. – techfoobar

這是那些「聰明」的技術之一，在少數情況下很酷，但其餘的時間只是使代碼更難閱讀並因此難以維護。但絕對要注意的一點。 – nnnnnn

您可能需要閱讀這篇文章上隱藏之間的差異，淡化和動畫。我只是提到它，因爲如果任何東西在頁面上相對於隱藏/顯示元素相對定位，這些技術的差異可能會使佈局真的搞砸。

http://www.catchmyfame.com/2010/08/31/jquery-hide-vs-fadeout-vs-animate/

既然你要在許多不同的場景來使用此，我將建立2個功能，你可以調用。

HideOverlay，它刪除疊加層並使索引可見。

ShowOverlay，它刪除索引並使覆蓋層可見。

這些裏面你可以切換。如果您在腳本中的其他場景中隱藏索引與索引分開，請創建另一個函數，並從hideOverlay/showOverlay中調用它。（其他人可能會建議通過傳遞true/false變量爲這個覆蓋隱藏/顯示創建一個單獨的函數，但是我想保持簡單，直到我知道發生了什麼，然後在我完全理解了如何完成時進行細化它的工作原理）

來源

2012-01-24 07:43:31 nosarious

如果'X'div可見，'Y'div被隱藏。如果'X'Div隱藏，'Y'div可見

回答

相關問題