如果url是'/ contact'並且屏幕大小中等或較大，則隱藏頁腳

我正在使用AngularJS和Bootstrap。如果url是'/ contact'並且屏幕大小中等或較大，則隱藏頁腳

我有類頁腳股利如下圖所示：

<div class="footer"> 
    ..... 
</div>

我所試圖達到什麼目的？

我想隱藏兩個條件這個div：

如果網址在瀏覽器是「/接觸」
如果屏幕尺寸爲中型或大型。

如果上述兩個條件都滿足，那麼只能隱藏div。

我所知道的：

我知道如何檢測AngularJS網址：我可以使用$location.path。
我也知道我可以使用媒體查詢來顯示或隱藏CSS中的元素。也有類似visible-md和visible-lg這可以幫助我。

我不知道是什麼：

上述兩個條件的組合。

來源

2017-06-22 Vishal

我不知道您用作模板系統，但您可以爲聯繫頁面使用不同的佈局/部分，以便它可以通過mediaquery控制一個特殊的類。如果這是不可能的，你添加一個腳本，檢查網址，並添加一個特殊的類到腳註如果'location.href'以'/ contact'結尾 – fcalderan

@fcalderan你能詳細說明嗎？我使用ejs作爲模板引擎。 – Vishal

如果您知道如何檢測網址，您是否可以不爲該網址的身體標記添加類，然後只要使用媒體查詢來隱藏頁腳即可，如果它在該類內 – Pete

在你的js添加該代碼文件

$scope.contactPath = false; 
if($location.path === "contact") 
{ 
    $scope.contactPath = true; 
}

，並把這個代碼在HTML文件中

<div data-ng-if="contactPath" class="footer visible-md visible-lg"> 
    ..... 
</div>

現在你只能看到且僅當contactPath是真實的，你的屏幕大小適中或大。

來源

2017-06-22 12:36:52 Dixit

我只是改變了一下你的代碼。我想我應該調用$ location.path（）。所以，我做到了。然後我刷新了頁面。但是頁腳總是隱藏的。然後，我改變了ng - 如果是隱藏，現在如果我在聯繫頁面上，然後如果我刷新瀏覽器窗口，則隱藏頁腳。如果我在任何其他頁面上，並且如果我刷新窗口，則可以看到頁腳。但是，如果我刷新頁面，頁腳只會改變其可見性。如果我瀏覽菜單，那麼頁腳的可見性沒有變化 – Vishal

@Vishal將這段代碼放在每個頁面（js文件）的開頭，以檢查$ location.path ===「contact」與否。 – Dixit

如果url是'/ contact'並且屏幕大小中等或較大，則隱藏頁腳

回答

相關問題