[FOORUM] Teema thumbnail

Vaata eelmist teemat Vaata järgmist teemat Go down

Tonight
Tonight

[FOORUM] Teema thumbnail Vetera11
Liitus : 19/02/2012
Postitusi : 17991

PostitamineTonight 02.07.15 8:06

[FOORUM] Teema thumbnail Sub10

See script kuvab iga teema juures esimese teemasse postitatud pildi, mis annab kasutajale kerge eelvaate.

Lisa Javascript (ACP -> Modules -> HTML & JAVASCRIPT -> Javascript codes management -> [FOORUM] Teema thumbnail Ajoute10).
In the sub-forums
Kood:
/***
     * Copyright (c) 2013 JScript <jscriptbrasil at live dot com>
     */
    jQuery(function () {
        var sCSS =
            '<style>' +
            '.bim_mainThumb {' +
                'opacity: 1;' +
                'visibility: visible;' +
                'max-width: none;' +
                'max-height: none;' +
                'width: 100%;' +
                'height: auto;' +
                'display: block;' +
                'image-rendering: auto' +
            '}' +
            '.bim_thumbPreview {' +
                'float: right;' +
                'position: relative;' +
                'z-index: 0;' +
            '}' +
            '.bim_img_container {' +
                'height: 70px;' +
                'width: 70px;' +
            '}' +
            '.bim_thumbPreview span {' +
                'box-shadow: 0 6px 6px rgba(0, 0, 0, 0.5);' +
                'margin-left: 84px;' +
                'margin-top: -68px;' +
                'position: absolute;' +
                'visibility: hidden;' +
                'z-index: 100;' +
            '}' +
            '.bim_thumbPreview:hover span {' +
                'visibility: visible;' +
            '}' +
            '.bim_thumbPreview span img {' +
                'border: 3px solid #000000;' +
                'max-width: 300px;' +
            '}' +
            '</style>';
        document.head.insertAdjacentHTML('beforeEnd', sCSS);

        var sHtml =
                '<a class="bim_thumbPreview">' +
                    '<div style="padding: 1px; border: 1px solid #d5d5d5;">' +
                        '<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 = '';
          
        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 = '#page-body .post:first .postbody img:first';
        } else if(phpBB3.length) {
            oTarget = phpBB3;
            sFound = 'dd.dterm';
            sInsert = 'div.topic-title-container';
            sOverflow = 'inherit';
            sGetIMG = '#main-content .post:first .content img:first';
        } else if(punbb.length) {
            oTarget = punbb;
            sFound = '.tcl.tdtopics';
            sInsert = 'span.status';
            sGetIMG = '.main-content.topic .entry-content:first img:first';
        } else if(invision.length) {
            oTarget = invision;
            sInsert = sCommon;
            sGetIMG = '.borderwrap .post-entry:first img:first';
        };

        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);

                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 {
                    jQuery(window).on('scroll.' + sUrl, showImage(sUrl, elem, oFound, sGetIMG));
                }
            }
        });
    });
    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() */ );
    }
    function showImage(event, elem, oBject, sString) {
       return function() {
          if (isInViewPort(elem)) {
             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');
                        }
                    }
                });
            }
       }
    }

Vaata eelmist teemat Vaata järgmist teemat Tagasi üles

Soovid vestluses osaleda?

Selleks logi sisse või tee endale kasutaja.

Liitu foorumiga

Tee endale kasutaja ning osale aruteludes.


Tee uus kasutaja

Logi sisse

Omad foorumis juba kasutajat? Logi sisse.


Logi sisse

 
Permissions in this forum:
Sa ei saa vastata siinsetele teemadele