Forumul forumurilor: forum de suport al utilizatorilor Forumgratuit
Doriți să reacționați la acest mesaj? Creați un cont în câteva clickuri sau conectați-vă pentru a continua.

Pălărie de Moș Crăciun, imagini, icoane sau insigne pe avatar

Vezi subiectul anterior Vezi subiectul urmator In jos

  • 0

Tutorial Pălărie de Moș Crăciun, imagini, icoane sau insigne pe avatar

Mesaj Scris de Mihai Mier Noi 10, 2021 7:33 pm

Pălărie de Moș Crăciun, imagini, icoane sau insigne pe avatar

Pălărie de Moș Crăciun, imagini, icoane sau insigne pe avatar Tuto_g10
Posibilitatea suprapunerii unei imagini pe toate avatarurile forumului fie in mesajele, fie in mini avatarul ultimei mesaje si in widgetul de conectare.

Vom adăuga acest javascript

» Panoul de administrare > Module > HTML și JAVASCRIPT > Gestionarea codurilor JavaScript
Poziție: pe toate paginile

Cod:
    $(function() {
        /*** zona editable ***/
            var last = true; // true ó false : para que aparezca o no en los avatares del apartado ULTIMOS MENSAJES
            var topic = true; // true ó false : para que aparezca o no en los avatares del perfil de los mensajes
            var conexion = true; // true ó false : para que aparezca en el widget CONEXIÓN
            var imageURL= "https://i.servimg.com/u/f68/09/00/22/90/santac10.png"; 
        /**** fin zona editable ***/
            if (topic == true) {
                var xmas = '<div class="xmas-hat-profile"><img src="'+imageURL+'"></div>';
                $('.postprofile').before(xmas);
            }

            if (last == true) {
                $('.lastpost-avatar').before('<div class="xmas-hat-lastTopics"><img src="'+imageURL+'"></div>');
            }
     
            if (conexion == true) {
              $('.mod-login-avatar').before('<div class="xmas-hat-Conexion"><img src="'+imageURL+'"></div>');
            }
       
        });

Vom adăuga CSS pentru a poziționa și modela imaginea

» Panoul de administrare > Vizualizare > Imagini și culori > Culori> Foaie de stil CSS
Cod:
.xmas-hat-profile img {
    width: 100px;
    margin-left: -50px;
    margin-top: -12px;
    z-index: 9;
    float: left;
    position: absolute
       
}
.xmas-hat-lastTopics img {
    width: 30px;   
    margin-left: -9px  ;
    margin-top: -2px;
    z-index: 9;
    float: left;
    position: relative;
}
.xmas-hat-lastTopics{
  float: left;   
  margin-right: -26px;   
  position: relative;   
  top: -1px;
}
.xmas-hat-Conexion img {
        width: 100px;
        margin-left: -35px;
        margin-top: -15px;
        z-index: 9;
        float: left;
        position: absolute;
    }
Vă reamintim că, ca întotdeauna atunci când instalăm codurile CSS ale unui tutorial, trebuie să avem în vedere că acestea reprezintă un punct de plecare și că, pentru a ajusta rezultatul instalării tutorialului la designul și elementele forumului nostru, este posibil să trebuie să ajustați valorile propuse în tutorial sau chiar să adăugați noi proprietăți.


Pălărie de Moș Crăciun, imagini, icoane sau insigne pe avatar Untit104
Pălărie de Moș Crăciun, imagini, icoane sau insigne pe avatar KmYIBDv
Pălărie de Moș Crăciun, imagini, icoane sau insigne pe avatar Scre1015 Pălărie de Moș Crăciun, imagini, icoane sau insigne pe avatar 398 Pălărie de Moș Crăciun, imagini, icoane sau insigne pe avatar 2209 Pălărie de Moș Crăciun, imagini, icoane sau insigne pe avatar Scre1016 Pălărie de Moș Crăciun, imagini, icoane sau insigne pe avatar Portoq16
Mihai

Mihai
Administrator
Administrator

Mesaje : 1469
Varsta : 24
Localizare : București, România
Data înscrierii : 25/09/2014
Mulțumiri : 101
Google Chrome phpBB3

http://fgsuport.forumgratuit.ro
Mihai a fost mulțumit de autorul acestui subiect.

Vezi subiectul anterior Vezi subiectul urmator Sus

- Subiecte similare

Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum