Hi dear all,
Using this topic https://help.forumotion.com/t130893-how-can-i-add-some-infos-about-last-post-in-the-board-index I want to move this box like this picture http://prntscr.com/2ychhy the post preview icon to move before the topic title. Furthermore it has delays on loading the picture. I am using this JavaScript
Best Regards,
Dark-Avenger
Using this topic https://help.forumotion.com/t130893-how-can-i-add-some-infos-about-last-post-in-the-board-index I want to move this box like this picture http://prntscr.com/2ychhy the post preview icon to move before the topic title. Furthermore it has delays on loading the picture. I am using this JavaScript
- Spoiler:
- Code:
/***
    * Application: Topic Thumbnail
    * Description: This application can displays thumbnails of topics.
    * Version: 1.03032014-jq1.9.1 - Udyat (Argumentum parvam)
    * Made and Optimizations by JScript - 2014/03/03
    * View more in: http://ajuda.forumeiros.com
    * Copyright (c) 2013 JScript <jscriptbrasil at live dot com>
    * This work is free. You can redistribute it and/or modify it
    * under the terms of the WTFPL, Version 2
    */
   jQuery(function () {
               var sHtml =
               '<a class="bim_thumbPreview">' +
                   '<div style="padding: 1px; border: none;">' +
                       '<div class="thumbIMG">' +
                           '<div class="bim_img_container" style="overflow: hidden; background-image: none;">' +
                               '<img src="http://2img.net/i/fa/empty.gif" class="bim_mainThumb">' +
                           '</div>' +
                       '</div>' +
                   '</div>' +
                   '<span class="previewIMG"><img src="http://i55.servimg.com/u/f55/18/17/62/92/no_ima10.jpg"></span>' +
               '</a>';
     Â
       var oTarget = 0,
           sFound = 'td:eq(2)',
           sInsert = '',
           sCommon = 'a.topictitle',
           sOverflow = 'auto',
           sGetIMG = '';
         Â
       /* Forum versions! */
       var phpBB2 = jQuery('.three-col td:eq(1) > table.forumline:last tbody tr:not(":empty")');
       var phpBB3 = jQuery('.topiclist.topics.bg_none li:not(":empty")');
       var punbb = jQuery('.statused tr:not(":empty")');
       var invision = jQuery('.borderwrap table.ipbtable tbody tr:not(":empty")');
     Â
       if (phpBB2.length) {
           oTarget = phpBB2;
           sInsert = 'div.topictitle';
           sGetIMG = '.postbody:first div:eq(0) img';
       } else if(phpBB3.length) {
           oTarget = phpBB3;
           sFound = 'dd.dterm';
           sInsert = 'div.topic-title-container';
           sOverflow = 'inherit';
           sGetIMG = '.postbody:first .content img';
       } else if(punbb.length) {
           oTarget = punbb;
           sFound = '.tcl.tdtopics';
           sInsert = 'span.status';
           sGetIMG = '.entry-content:first img';
       } else if(invision.length) {
           oTarget = invision;
           sInsert = sCommon;
           sGetIMG = '.post-entry:first img';
       };
       oTarget.each(function( index ) {
           var oFound = jQuery(this).find(sFound);
           if (oFound.length) {
               var oInsert = oFound.find(sInsert);
               var sUrl = oFound.find(sCommon).attr('href');
               var ID = 'Udyat_' + index;
               oFound.attr('id', ID);
               oFound.css('overflow', sOverflow);
               jQuery(sHtml).insertAfter(oInsert);
               /***
               * Only show the image if is visible in browser window (view port)!!!
               * Made and Optimizations by JScript at www.punbb.forumeiros.com
               */
               var elem = document.getElementById( ID );     Â
               if (isInViewPort(elem)) {
                   jQuery.get(sUrl, function(data) {
                       var oImg = jQuery(sGetIMG, data);
                       var sImg = '';
                       if (oImg !== undefined) {
                           sImg = oImg.attr('src');
                           if (sImg !== undefined) {
                               oFound.find('.bim_img_container img').attr('src', sImg);
                               oFound.find('.previewIMG img').attr('src', sImg);
                           } else {
                               oFound.find('.bim_img_container img').attr('src', 'http://i55.servimg.com/u/f55/18/17/62/92/no_ima10.jpg');
                           }
                       }
                   });
               } else {
                   /* Fire event for 'scroll' to show the image... */
                   jQuery(window).on('scroll.' + sUrl, showImage(sUrl, elem, oFound, sGetIMG));
               }
           }
       });
   });
   /* Function to check if an element is visible in view port */
   function isInViewPort(elem) {
      var rect = elem.getBoundingClientRect();
      return (
      rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && /*or $(window).height() */
      rect.right <= (window.innerWidth || document.documentElement.clientWidth) /*or $(window).width() */ );
   }
   /* Start function to show the image... */
   function showImage(event, elem, oBject, sString) {
      return function() {
           /* Chech if the element is visible in view port! */
         if (isInViewPort(elem)) {
               /* If visible, stop event!!! */
            jQuery(window).off('scroll.' + event);
               jQuery.get(event, function(data) {
                   var oImg = jQuery(sString, data);
                   var sImg = '';
                   if (oImg !== undefined) {
                       sImg = oImg.attr('src');
                       if (sImg !== undefined) {
                           oBject.find('.bim_img_container img').attr('src', sImg);
                           oBject.find('.previewIMG img').attr('src', sImg);
                       } else {
                           oBject.find('.bim_img_container img').attr('src', 'http://i55.servimg.com/u/f55/18/17/62/92/no_ima10.jpg');
                       }
                   }
               });
           }
      }
   }
Best Regards,
Dark-Avenger
Last edited by Dark-Avenger on March 10th 2014, 2:27 am; edited 2 times in total