Advertisement

Τεχνολογικές Ειδήσεις, Υποστήριξη, Διαδίκτυο, Ψυχαγωγία, Αγγελίες, Smartphones, Tablets, Games, Eπιστήμη, Free Software

Διαγωνισμός
Δώρο 3 άδειες για το Kaspersky Internet Security 2017 & 3 άδειες για το Safe Kids

  • Δεν μπορείτε να ξεκινήσετε ένα νέο θέμα


    Απαντήσεις σε αυτό το θέμα

    Επισκόπηση προηγούμενης Θ.Ενότητας Επισκόπηση επόμενης Θ.Ενότητας Πήγαινε κάτω Μήνυμα [Σελίδα 1 από 1]  

    Δημοσίευση: 1 Εικόνα από τα Θέματα στα Sub-Forums Την / Το Σαβ 6 Δεκ 2014 - 18:44

    J0k3R^

    Senior Member

    Επιστροφή στην κορυφή
    :WAVE:
    Θα απαντουσα στο θεμα του Κωστα (http://www.thegreeksenergy.com/t65299-topic)
    αλλα εχω να ζητησω αρκετα πραγματα γιαυτο προτιμισα να ανοιξω καινουριο θεμα.
    Οι κωδικες του Παυλου λειτουργησαν και τον ευχαριστω πολυ αλλα θα ηθελα καποιες περαιτερω επεξεργασιες.

    δεν θελω να εμφανιζεται η εικονα οταν κανω hover. εκτος και αν εμφανιζονται ολοκληρες χωρις να υπαρχει scroll γιατι τωρα ειναι καπως κακο..
    Επιπλεον, θα ηθελα αυτες οι εικονες απτα θεματα να εμφανιζονται μονο σε 2 κατηγοριες και οχι σε ολες. Πως μπορω να επιλεξω?
    Τελος, τα "icons for topics" (θεμα, hot, ανακοινωση κλπ) καλυπτονται απο τις εικονες



    Ευχαριστω εκ των προτερων για οποιες απαντησεις  :h123:

    Επισκόπηση του προφίλ των χρηστών http://www.fmplatnet.forumgreek.com

    Δημοσίευση: 2 Απ: Εικόνα από τα Θέματα στα Sub-Forums Την / Το Κυρ 7 Δεκ 2014 - 13:14

    Paulos

    WebMaster

    Επιστροφή στην κορυφή
    Κώδικας:
    jQuery(function () {
            var html =
                    '<a class="list_imagepreview">' +
                        '<div style="padding: 1px; border: 1px solid #ddd;">' +
                            '<div class="listimage">' +
                                '<div class="list_image2">' +
                                    '<img src="http://illiweb.com/fa/empty.gif" class="list_image">' +
                                '</div>' +
                            '</div>' +
                        '</div>' +
                        '<span class="listimage2"><img src="http://i55.servimg.com/u/f55/18/17/62/92/no_ima10.jpg"></span>' +
                    '</a>';
         
            var listt = 0,
                i1 = 'td:eq(2)',
                i2 = '',
                i3 = 'a.topictitle',
                i4 = 'auto',
                i5 = '';
             
          var punbb = jQuery('.statused tr:not(":empty")');
           
    if (punbb.length) {
                listt = punbb;
                i1 = '.tcl.tdtopics';
                i5 = '.entry-content:first img';
                i2 = 'span.status';
           
            };

            listt.each(function( index ) {
                var i6 = jQuery(this).find(i1);
                if (i6.length) {
                    var list_i = i6.find(i2);
                    var listu = i6.find(i3).attr('href');
                    var ID = 'imglist_' + index;

                    i6.attr('id', ID);
                    i6.css('overflow', i4);
                    jQuery(html).insertAfter(list_i);

                    var elem = document.getElementById( ID );       
                    if (isInViewPort(elem)) {
                        jQuery.get(listu, function(data) {
                            var listimg2 = jQuery(i5, data);
                            var listimg = '';

                            if (listimg2 !== undefined) {
                                listimg = listimg2.attr('src');
                                if (listimg !== undefined) {
                                    i6.find('.list_image2  img').attr('src', listimg);
                                    i6.find('.listimage2 img').attr('src', listimg);
                                } else {
                                    i6.find('.list_image2 img').attr('src', 'http://i59.servimg.com/u/f59/15/84/77/97/thumbn10.png');
                                }
                            }
                        });
                    } else {

                        jQuery(window).on('' + listu, showImage(listu, elem, i6, i5));
                    }
                }
            });
        });

        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('' + event);
                    jQuery.get(event, function(data) {
                        var listimg2 = jQuery(sString, data);
                        var listimg = '';

                        if (listimg2 !== undefined) {
                            listimg = listimg2.attr('src');
                            if (listimg !== undefined) {
                                oBject.find('.list_image2 img').attr('src', listimg);
                                oBject.find('.listimage2 img').attr('src', listimg);
                            } else {
                                oBject.find('.list_image2 img').attr('src', 'http://i59.servimg.com/u/f59/15/84/77/97/thumbn10.png');
                            }
                        }
                    });
                }
          }
        }


    Κώδικας:
    .list_image {
        display: block;
        height: 70px;
        opacity: 1;
        visibility: visible;
        width: 100%;
    }
    .list_imagepreview {
        float: right;
        position: relative;
        z-index: 0;
      margin-left: -30px;
    }
    .list_image2 {
        height: 70px;
        width: 70px;
    }
    .list_imagepreview span {
        box-shadow: 0 1px 3px rgba(0, 0, 0, 0.7);
        margin-left: 84px;
        margin-top: -68px;
        position: absolute;
        visibility: hidden;
        z-index: 100;
    }
    .list_imagepreview:hover span {
        visibility: visible;
    }
    .list_imagepreview span img {
        border: 1px solid #ddd;
        width: 300px;
    }


    Επιπλεον, θα ηθελα αυτες οι εικονες απτα θεματα να εμφανιζονται μονο σε 2 κατηγοριες και οχι σε ολες

    Δεν γίνεται....

    Hover κάνει μόνο αν πατάς πανω στην εικόνα

    Επισκόπηση του προφίλ των χρηστών

    Δημοσίευση: 3 Απ: Εικόνα από τα Θέματα στα Sub-Forums Την / Το Κυρ 7 Δεκ 2014 - 15:52

    atozak

    Senior Member
    Συνδεδεμένος

    Επιστροφή στην κορυφή
    το video δεν πεζει http://prntscr.com/5e60ls

    Επισκόπηση του προφίλ των χρηστών http://www.thegreeksenergy.com

    Δημοσίευση: 4 Απ: Εικόνα από τα Θέματα στα Sub-Forums Την / Το Κυρ 7 Δεκ 2014 - 16:34

    J0k3R^

    Senior Member

    Επιστροφή στην κορυφή
    ναι το ξερω, το εσβησα επειδη λυθηκε το θεμα :)

    Επισκόπηση του προφίλ των χρηστών http://www.fmplatnet.forumgreek.com

    Δημοσίευση: 5 Απ: Εικόνα από τα Θέματα στα Sub-Forums Την / Το Κυρ 7 Δεκ 2014 - 17:10

    atozak

    Senior Member
    Συνδεδεμένος

    Επιστροφή στην κορυφή
    οκ απλα το ανεφερα Wink

    Επισκόπηση του προφίλ των χρηστών http://www.thegreeksenergy.com

    Δημοσίευση: 6 Απ: Εικόνα από τα Θέματα στα Sub-Forums Την / Το Πεμ 11 Δεκ 2014 - 10:42

    Christina

    Global Moderator

    Επιστροφή στην κορυφή
    Το θέμα λύθηκε και κλειδώνεται.

    Επισκόπηση του προφίλ των χρηστών

    Μήνυμα [Σελίδα 1 από 1]

    Δεν μπορείτε να ξεκινήσετε ένα νέο θέμα


    Μοιραστείτε αυτό το θέμα

    Url
    BBcode
    HTML

    Δικαιώματα σας στην κατηγορία αυτή. Δεν μπορείτε να απαντήσετε στα Θέματα αυτής της Δ.Συζήτησης