Gorra de navidad en los nick de foros vBulletin/phpBB3 con Javascript

America|UNK · #1 (**permalink**) 28/11/2013, 12:35

Hola, a continuación compartí ese simple script en otro foro. Lo que pretende hacer, es colocar una imágen (gorra de navidad) arriba de los nick's del foro.

Código:

			/*!
				Gorra navidad jQuery v1.0 by [email protected]
				//Añadir en las etiquetas <head>:
					<head>
						<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
						<script type="text/javascript">
							codigo...
						</script>
					</head>
			*/

Código:

Código PHP:

              $(document).ready(function(){

                var cfg = {

                    selectors    : 'a.username, a.bigusername, .author a[href*="memberlist"]',

                    position     : {x: 12, y: -7},

                    size        : {width: 25, height: 25},

                    image        : 'http://i.imgur.com/ZVU2m37.png?1' //mismo tamaño de size

                };

                

                $(cfg.selectors).each(function(){

                    var e = $(this), p = e.offset(), g = $("<div/>").css({

                        position: 'absolute',

                        top: p.top + cfg.position.y + "px",

                        left: p.left + e.width() - cfg.size.width + cfg.position.x + "px",

                        width: cfg.size.width + "px",

                        height: cfg.size.height + "px",

                        background: 'transparent url('+cfg.image+') no-repeat 0',

                        display: 'none'

                    });

                    $("body").append(g.fadeIn('slow'))

                });

            });

Resultado:

Espero les sirva, saludos

marlanga · #2 (**permalink**) 28/11/2013, 12:41

Buena idea y buen trabajo. Modifícalo para ponerlo sobre las imágenes de avatar, a quien la tenga, o sobre el nick, a quien no tenga, y lo clavas.

America|UNK · #3 (**permalink**) 28/11/2013, 12:52

Cita:

Iniciado por marlanga

Buena idea y buen trabajo. Modifícalo para ponerlo sobre las imágenes de avatar, a quien la tenga, o sobre el nick, a quien no tenga, y lo clavas.

Depende para que que versión de foro lo haría, todos tienen estructura diferente, más tarde lo modifico para todas las versiones de foro :)