淘汰賽，如果綁定到jquery mobile靜態頭保留空間

我的頁面有一個靜態頭（jqm），它根據參數有條件地顯示。那麼，綁定是工作，即它正在有條件地顯示，頁面內容不會向上移動當標題是而不是顯示。淘汰賽，如果綁定到jquery mobile靜態頭保留空間

我也嘗試過css綁定來設置display none沒有運氣。

HTML：

<div class="home-header" data-role="header" data-position="fixed" data-theme="c" data-bind="if: isFish, style: {display:isFish()? 'block':'none'} "> 
    <div class="logo" style="margin:0 auto;"></div> 
    </div> 
    <div>Content starts here</div> 
    <div data-bind="text:count"></div> 
    <div data-bind="text:isFish"></div>

的javascript：

var viewModel = new function() { 
    var self = this; 

    if (sessionStorage.clickcount) { 
    sessionStorage.clickcount = Number(sessionStorage.clickcount) + 1; 
    } else { 
    sessionStorage.clickcount = 1; 
    } 

    self.count = ko.observable(sessionStorage.clickcount); 
    self.isFish = ko.computed(function() { 
    return self.count() % 2 ==0; 
    }); 

}; //viewModel 

$(document).ready(function() { 
    ko.applyBindings(viewModel); 
});

Here's the demo。

點擊「運行」按鈕幾次，看到魚的圖片隱藏或顯示取決於計數。

當圖片未顯示時，我想要在最上方的「內容從這裏開始」一行。怎麼做？提前致謝。

來源

2016-06-07 WhatsInAName

哇，我花了一些時間來掌握實際的問題，但是這是一個奇怪的一個。我發現，在不顯示*的情況下，如果我將瀏覽器窗口大小調整爲1像素，則會跳起來。罪魁禍首是由（我認爲）jquery-mobile插入的「div data-role =」page「'，它具有填充（作爲元素樣式和來自類的填充）導致該空間出現。 - 我不是jquery-mobile的專家，但是我猜測你需要使用'data-bind =「css ...」'並設置一個適當的jquery類來隱藏事物，而不是內聯樣式？ – Jeroen

是的，你是對的。如果窗口被調整大小，它會跳起來，是的，data-role =「page」插入填充。我將嘗試使用css綁定來綁定一個類，並用jquery隱藏它。 – WhatsInAName

你可以嘗試這樣的

<!-- ko if: isFish--> 
<div class="home-header" data-role="header" data-position="fixed" data-theme="c"> 
    <div class="logo" style="margin:0 auto;"></div> 
</div> 
<!--/ko-->

來源

2016-06-08 08:45:27

雖然它在小提琴中工作，但它不在實際的jQuery移動環境中。如果使用此解決方案，我會將背景圖像拉伸以適合窗口，並且圖像的底部會被切斷。 Upvoting你使它在小提琴中工作。 – WhatsInAName

淘汰賽，如果綁定到jquery mobile靜態頭保留空間

回答

相關問題