my tumblr 主题无限滚动效果不佳。 （图像未加载）

问题描述 投票：0回答：0

我有我的 tumblr 博客，我做了我的主题。我的主题效果不佳。我使用了 infinite-scroll.com 的无限滚动，它确实有效，但我发现在滚动 15 篇文章（基本选项）后，没有图像，内置视频也不起作用。图片未加载，内置视频仅显示缩略图。更令人沮丧的是，它只针对 ios 发布。无限滚动在带有无限图像的桌面上运行良好。我在下面添加我的来源。


<!DOCTYPE html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, user-scalable=no"/>
    <title>{Title}</title>
    <link rel="shortcut icon" href="{Favicon}">
    <link rel="apple-touch-icon" href="{PortraitURL-128}">
    <link rel="alternate" type="application/rss+xml" href="{RSS}">
    <meta name="color:back" content="#ffffff"/>
    <meta name="color:text" content="#000000"/>
    <meta name="color:accent" content="#bbbbbb"/>
<style>
        body            {
        width:40%;
        margin:50px auto;
        background-color:{color:back};
        font-family:'Helvetica Neue', HelveticaNeue, Helvetica, Arial, sans-serif;
        font-size:medium;
        font-display:auto;
        line-height:1.6;
        font-weight:bold;
        }
        @media screen and (max-width: 768px) {
        body            {
        width: 100%;
        }
        }
        article, :after {
        margin:50% auto;
        }
        article:after   {
        {block:indexpage}    
        display:block;
        content:"";
        border-bottom:1px solid {color:accent};
        width:80%;
        {/block:indexpage}
        }
        a               {
        text-decoration:none;
        color: {color:accent};
        }
        
        p, ol, ul, h1   {
        color: {color:text};
        list-style-type:none;
        padding:0 25%;
        }
        li              {
        display:inline-block;
        }
        h1, h2          {
        font-size:inherit;
        font-weight:inherit;
        }/* h1 title */
        h2              {
        display:inline;
        }/* h2 tags */
        .ask            {
        float:right;
        }
        .tumblr_video_container, iframe.embed_iframe, #youtube_iframe, video, .npf_row, figure, .tmblr-full     {
        display:flex;
        justify-content:center;
        flex-wrap:nowrap!important;
        margin-left:!important;
        max-height:unset!important;
        text-align:center;
        }
        figure img, img.photo     {
        width:100%!important;
        height:auto!important;
        max-height:unset!important;
        }
        iframe#ask_form, iframe.tumblr_audio_player      {
        display:block;
        width:1px;
        min-width:100%;
        height:auto;
        }
        iframe.tmblr-iframe     {
        display:none!important;    
        }
        </style>
        
        
            {block:Pagination}
        <script src="https://code.jquery.com/jquery-3.6.3.min.js"
integrity="sha256-pvPw+upLPUjgMXY0G+8O0xUf+/Im1MZjXxxgOcBQBXU="
crossorigin="anonymous"></script>
        <script src="https://static.tumblr.com/yoelavh/QTprqlehu/infinite-scroll.pkgd.min.js"></script>
        <script>
        $(document).ready(function(){
        var $container = $('.container').infiniteScroll({
        // options
        path: '#next',
        append: '#post',
        scrollThreshold: 50000,
        prefill: true,
        hidenav:'.pagination'
        });
        });
        </script>
        {/block:Pagination}
        
        
</head>
<body>
<header><ul><li><a href="http://hataesun.com">{title}</a>
        {block:NoSearchResults}
        {SearchQuery}에 대한 결과가 없습니다.
        {/block:NoSearchResults}
        {block:TagPage}
        <h2>{Tag}</h2>
        {/block:TagPage}</li></li>
        <li class="ask">
        {block:AskEnabled}<a href="/ask">질문</a>{/block:AskEnabled}
</ul></header>
<div class="container">
        <section>
        <div class="pagination"><a onclick='return false;' {block:NextPage}href={NextPage} id="next" {/block:NextPage}></a></div>
        {block:Posts}
        <article id="post" class="{PostType}" title="{ShortYear}년 {MonthNumber}월 {DayOfMonth}일 {24Hour}:{Minutes} {block:NoteCount}+{NoteCount}{/block:NoteCount}">
            {block:text}
                {Body}
                {block:More}<ul><a href="{Permalink}" target="_blank"><h2>더 읽기</h2></a></ul>{/block:More}
                {block:Title}<h1>{Title}</h1>{/block:Title}
            {/block:text}
            {block:Photo}
                <img src="{PhotoURL-HighRes}" class="photo" alt="{PhotoAlt}">
                {block:Caption}{Caption}{/block:Caption}
            {/block:Photo}
            {block:Photoset}
                {block:Photos}
                <img src="{PhotoURL-HighRes}" class="photo" alt="{PhotoAlt}">
                {/block:Photos}
                {block:Caption}{Caption}{/block:Caption}
            {/block:Photoset}
            {block:Quote}
                <p>{Quote}</p>
            {/block:Quote}
            {block:Link}
                <p><a href="{URL}"{Target}>{Name}</a></p>
                {block:Description}{Description}{/block:Description}
            {/block:Link}
            {block:Chat}
                {block:Lines}
                <p>{block:Label}<h2>{Label}</h2> {/block:Label}{Line}</p>
                {/block:Lines}
                {block:Title}<h1>{Title}</h1>{/block:Title}
            {/block:Chat}
            {block:Audio}
                {AudioEmbed}
                {block:Caption}{Caption}{/block:Caption}
            {/block:Audio}
            {block:Video}
                {Video-700}
                {block:Caption}{Caption}{/block:Caption}
            {/block:Video}
            {block:Answer}
                <p><ul><h2>{Asker}</h2></ul><i>{Question}</i></p>
                {Answer}
                {block:More}<ul><a href="{Permalink}" target="_blank"><h2>더 읽기</h2></a></ul>{/block:More}
            {/block:Answer}
            
            <ul>

            {block:HasTags}
                {block:Tags}
                <li><a href="{TagURL}"><h2>{Tag}</h2></a></li>
                {/block:Tags}
            {/block:HasTags}
            </ul>
        </article><!-- /post -->
        {/block:Posts}
</section> <!-- /posts -->
<!-- /content -->
</body>
</html>

    });
    });
    </script>
    {/block:Pagination}`

我看到 ios 源代码，它在 15 篇文章后有 iframe，所以我显示：none css but not changing.

ios tumblr tumblr-themes
最新问题
© www.soinside.com 2019 - 2024. All rights reserved.