0

Dashcode のテンプレートを使用して、単純な RSS Web アプリを作成しました。問題は、フィードからリスト内のアイテムを選択すると、トランジションがちらつくことです (デフォルト設定でも)。投稿の画像のせいだと思います。

トランジションを完全に無効にしようとしましたが、それでもリストに戻るとちらつきます。この問題は、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';
        }
    }
};
4

2 に答える 2

2

次のCSSルールは、iPadでの「-webkit-transition」アニメーションのちらつきの問題をすべて修正しました。

body {-webkit-transform:translate3d(0,0,0);}
于 2010-10-14T14:37:02.120 に答える
2

それがあなたの問題にどれだけ当てはまるかはわかりませんが、一般的には、必要がなければ背面の可視性を非表示に設定する必要があります。これにより、ページ上のすべてのちらつきがなくなる可能性が高くなります。

-webkit-backface-visibility: hidden;
于 2011-01-05T15:35:56.977 に答える