2014-09-29 13 views
2

那麼我現在要做的是讓一個博客帖子看起來像每一個博客文章頁頁眉的第一圖像....有沒有辦法讓我在博客貼子中選取第一張圖片,並將其作爲博客文章中的標題?

這是我到目前爲止有:

<b:if cond='data:post.firstImageUrl'> 
<img expr:src ="data:post.firstImageUrl" expr:alt="data:post.title"/> 
</b:if> 

但是,它不是真的有效。有人可以幫我嗎?示例請參閱this。我希望我的文章中的第一張圖片看起來像頁面上的標題....

回答

2

我也遇到了麻煩。我想你想用圖像作爲背景圖像。 我曾經使用過一些jquery。 你的目標與我的目標有點不同,所以我建議你實際上向你的第一張圖片添加一個類(可能想手動完成,或者使用javascript),獲取源代碼,將它作爲背景圖片添加到你的頭部和隱藏圖像標籤(不這樣做,如果重複意)

標記會再是這樣的:

<header class="imgbg"></header> 
<div class="post"> 
    <h1>Title</h1> 
    <p>Text</p> 
    <img src="#" class="first-img"> 
</div> 

和jQuery:

function getimgsrc(){ 
    $('.post').find('.first-img').each(function(n, image){ 
     var image = $(image); 
     var thisurl = $(this).attr('src'); 
     $('.imgbg').css('background-image', 'url(' + thisurl + ')');  
     $('.first-img').remove(); 
    }); 
} 

我建了一個codepen說明這個好一點:http://codepen.io/bekreatief/pen/BaFnx

相關問題