2010-10-09 40 views
0

我使用Dashcode中的模板創建了一個簡單的RSS Web應用程序。問題是,當從Feed中選擇列表中的項目時,轉換閃爍(即使使用默認設置)。我猜是因爲帖子中的圖片。Dashcode webapp在轉換時閃爍,僅在iPhone Safari中

我嘗試完全禁用轉換,但即使如此,當我返回到列表時,我得到了閃爍。這個問題似乎並不影響只在iPhone上的OSX上的safari。

下面是代碼,我認爲是負責任的:

var topStories = parseInt(attributes.topStories, 30); 

function load() 
{ 
    dashcode.setupParts(); 

    // set today's date 
    var todaysDate = document.getElementById("todaysDate"); 
    todaysDate.innerText = createDateStr(new Date()).toUpperCase(); 

    setupFilters("headlineList"); 

    // This message checks for common errors with the RSS feed or setup. 
    // The handler will hide the split view and display the error message. 
    handleCommonErrors(attributes.dataSource, 
    function(errorMessage) { 
     var stackLayout = document.getElementById("StackLayout") 

     if (stackLayout) { 
      stackLayout.style.display = 'none'; 
     } 

     showError(errorMessage); 
    }); 

    // get notifications from the stack layout when the transition ends 
    document.getElementById("StackLayout").object.endTransitionCallback = function(stackLayout, oldView, newView) { 
     // clear selection of lists when navigating to the first view 
     var firstView = stackLayout.getAllViews()[0]; 
     if (newView == firstView) { 
      document.getElementById("headlineList").object.clearSelection(true); 
     } 

    } 

} 

function articleClicked(event) 
{ 
    document.getElementById("StackLayout").object.setCurrentView("articlePage", false, true); 
} 

function backToArticlesClicked(event) 
{ 
    document.getElementById("StackLayout").object.setCurrentView("frontPage", true); 
} 

function readMoreClicked(event) 
{ 
    var headlineList = dashcode.getDataSource('headlineList'); 
    var secondHeadlines = dashcode.getDataSource("secondHeadlines"); 
    var selectedItem = null; 

    if (headlineList.hasSelection()) { 
     selectedItem = headlineList.selectedObjects()[0]; 
    } else if (secondHeadlines.hasSelection()) { 
     selectedItem = secondHeadlines.selectedObjects()[0]; 
    } 

    if (selectedItem) { 
     var link = selectedItem.valueForKeyPath('link'); 

     // If the link is an object, not a string, then this may be an ATOM feed, grab the actual 
     // href from the href attr 
     if (typeof(link) == 'object') { 
      link = selectedItem.valueForKeyPath('link.$href'); 

      // If the link is an array (there is more then one link), just grab the first one 
      if (DC.typeOf(link) == 'array') { 
       link = link[0]; 
      } 
     } 

     window.location = link; 
    } 

} 

var headlineListDataSource = { 

    // The List calls this method once for every row. 
    prepareRow: function(rowElement, rowIndex, templateElements) { 
     if (rowIndex >= topStories) { 
      templateElements['headlineDescription'].style.display = 'none'; 
      templateElements['headlineTitle'].style.fontSize = '15px'; 
     } 
    } 
}; 

回答

2

下面的CSS規則固定的我所有的 「-webkit-過渡」 動畫閃爍在iPad上的問題:

body {-webkit-transform:translate3d(0,0,0);} 
+0

神聖的,廢話,工作在現在無處不在的Webkit閃爍!你從哪裏找到這個竅門? [編輯:但它也摧毀Safari 5.1中的頁面。回到繪圖板....] – 2011-06-24 19:59:03

2

我我不確定這個問題適用於您的問題的情況如何,但總的來說,如果不需要,您應該將背面的可見性設置爲隱藏。這很可能會殺死頁面上的所有閃爍。

-webkit-backface-visibility: hidden;