How to stop post images loading in blogger main page?

问题

Images that inside post pages is loading on blogger main page. I want to that post images loading only post page. If you have answer for this problem. Please let me know. Thank you. This is my blogger URL: http://sritestweb.blogspot.com/

回答1:

Remove the post page images from the main page. And load it using javascript on load event of the main page.

//This function should be called on main page load event.
function onPageLoad(){
  //imgcontainer is 'id' of containing element.
  var container = document.getElementsById("imgcontainer");
   var img = document.createElement('img');
            img.setAttribute('src', imagePath);
    container.appendChild(img);
}

Doing this way, the rendering of the main page will not wait for the post images to get loaded.

回答2:

This works fine for me. Please check. (https://www.problogbooster.com/) 'default.jpg' is the one which you want to show before the actual image load. Keep the size of 'default.jpg'to minimum.

<!DOCTYPE HTML>
<html>

<head>
<script>
    function init() {
        var imgDefer = document.getElementsByTagName('img');
        for (var i=0; i<imgDefer.length; i++) {
        if(imgDefer[i].getAttribute('data-src')) {
        imgDefer[i].setAttribute('src',imgDefer[i].getAttribute('data-src'));
    } } }

</script>
</head>
<body onload="init()">
<img data-src="original-image1.jpg"  src="default.jpg">
</img>

<img data-src="original-image2.jpg" src="default.jpg">
</img>

</body>
</html>

来源：https://stackoverflow.com/questions/34715544/how-to-stop-post-images-loading-in-blogger-main-page

标签

javascript

jquery

html

xml

blogger