Staff en línea

[Javascript]Opciones para los hashtags
Tema iniciado por y Añadir a favoritos

[Javascript]Opciones para los hashtags 
el Mar Mayo 05, 2015 12:33 am
Mensaje  Chalo


Última edición por Chalo el Jue Ago 20, 2015 9:51 pm, editado 1 vez
[codebox]Agregaremos un menu para los hashtags[/codebox]


[hidecode]
Código:
$(function() {
  var a = document.getElementsByTagName('A'), b = document.createElement('DIV'), i = 0, j = a.length, actif, t;
  b.className = 'fa-hashtag-options';
  b.style.display = 'none';
  document.body.appendChild(b);
 
  for (; i<j; i++) {
    if (a[i].title && /\/tags\//.test(a[i].href) && /^#/.test(a[i].innerHTML)) {
      a[i].className += ' fa-hashtag';
     
      a[i].onclick = function() {
       
        if (actif != this) {
          actif = this, t = this.innerHTML;
          t.length > 24 && (t = t.slice(0, 25).replace(/^\s+|\s+$/g, '') + '...');
         
          b.style.left = $(this).offset().left + 'px';
          b.style.top = $(this).offset().top + 'px';
          b.innerHTML = '<div class="fa-hashtag-title">Options for <span class="fa-hashtag-tag">' + t + '</span></div><b>&bull; </b><a href="' + this.href + '">View tagged subjects</a>' + (_userdata.session_logged_in ? '<form method="post" name="addtag_form" action="/profile?mode=editprofile&page_profil=tags&start&submit=1"><b>&bull; </b><a href="#" onclick="this.parentNode.submit();return false;">Follow <span class="fa-hashtag-tag">' + t + '</span></a><input name="addtag" type="hidden" value="' + this.innerHTML.slice(1) + '"></form><b>&bull; </b><a href="/profile?mode=editprofile&page_profil=tags">Manage tags</a>' : '');
         
          /none/.test(b.style.display) && (b.style.display = 'block');
        } else {
          actif = null;
          b.style.display = 'none';
        }
       
        return false;
      };
    }
  }
});
[/hidecode]

El css

Código:
/* options drop down */
.fa-hashtag-options {
  color:#666;
  font-size:11px;
  font-family:Verdana,Arial,Helvetica,sans-serif;
  line-height:14px;
  background:#EEE;
  border:1px solid #CCC;
  border-radius:3px;
  box-shadow:0 3px 6px rgba(0, 0, 0, 0.175);
  margin-top:20px;
  padding:3px;
  position:absolute;
  z-index:100;
}

/* options title */
.fa-hashtag-title {
  font-size:12px;
  border-bottom:1px solid #CCC;
  padding-bottom:3px;
  margin-bottom:3px;
}

/* option links */
.fa-hashtag-options a {
  color:#333;
  text-decoration:none;
  display:inline-block;
  padding:2px 6px 2px 0;
}

.fa-hashtag-options a:hover {
  color:#666;
  text-decoration:underline;
}

/* option bullets */
.fa-hashtag-options b {
  color:#333;
  padding-left:6px;
}

/* option tags */
.fa-hashtag-tag {
  color:#000;
  font-weight:bold;

/* hashtag styles */
a.fa-hashtag {
  color:#666;
  text-decoration:none;
  background-color:#EEE;
  border:1px solid #CCC;
  border-radius:3px;
  display:inline-block;
  padding:3px;
}

a.fa-hashtag:hover {
  color:#333;
  background-color:#DDD;
  border-color:#999;
}
}
staff
Chalo
avatar

¿Que estoy pensando? :

los dias de ocio son geniales [table class=fecha_up][td]Se modifico:13/12/17 - 11:40 hrs. [/td][/table]


Banner en temas :

http://i.imgur.com/XlCMsAOh.jpeg


Color de titulos :

#fff


Sombra titulo :

0 0 1px #000


Mensajes :

6465


Puntos :

8477


Me gusta :

967


ingreso :

17/04/2014


Sexo :

Masculino

Plataforma :

phpbb3


Navegador :

chrome


Ver perfil de usuario http://www.opensourcephpbb3.com

Volver arriba Ir abajo

Re: [Javascript]Opciones para los hashtags 
el Mar Mayo 05, 2015 1:25 pm
Mensaje  Dosh
Buen aporte...
staff
Dosh
avatar

¿Que estoy pensando? :

Caballo sin nombre... [table class=fecha_up][td]Se modifico:31/07/17 - 20:22 hrs. [/td][/table]


Banner en temas :

http://i.imgur.com/FzYAhXk.jpg


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #fff


Mensajes :

1481


Puntos :

2155


Me gusta :

396


ingreso :

07/12/2014


Sexo :

Masculino

Plataforma :

punbb


Navegador :

Chrome


Ver perfil de usuario http://www.telefoneros.com/

Volver arriba Ir abajo

Re: [Javascript]Opciones para los hashtags 
el Dom Abr 17, 2016 7:43 pm
Mensaje  Thor
interesante gracias por el code
Thor
avatar

¿Que estoy pensando? :

El foro avanza... [table class=fecha_up][td]Se modifico:24/01/16 - 17:48 hrs.[/td][/table]


Banner en temas :

http://orig13.deviantart.net/2106/f/2012/344/c/4/facebook_cover_photo___quote_wall_by_eastbankbabs123-d5nnexo.png


Color de titulos :

#fff


Sombra titulo :

1px 1px 1px #fff


Mensajes :

333


Puntos :

415


Me gusta :

76


ingreso :

05/10/2014


Sexo :

Masculino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario http://www.adictosalgear.org

Volver arriba Ir abajo

Re: [Javascript]Opciones para los hashtags 
el Vie Sep 15, 2017 7:55 pm
Mensaje  muykay
Es muy útil seguir así: D
muykay
avatar

¿Que estoy pensando? :

Escribe lo que tienes en mente [table class=fecha_up][td]Se modifico:10/7/15 - 15:25 hrs.[/td][/table]


Banner en temas :

http://i64.tinypic.com/2i8tzma.jpg


Color de titulos :

#333


Sombra titulo :

1px 1px 1px #fff


Mensajes :

66


Puntos :

67


Me gusta :

1


ingreso :

07/09/2017


Sexo :

Masculino

Plataforma :

MYBB


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

Re: [Javascript]Opciones para los hashtags 
el Miér Sep 27, 2017 5:37 pm
Mensaje  Roger
gracias por el code
Roger
avatar

¿Que estoy pensando? :

Probando el status del foro [table class=fecha_up][td]Se modifico:9/03/17 - 9:13 hrs.[/td][/table]


Banner en temas :

http://thedesigninspiration.com/wp-content/uploads/2012/06/Facebook-Covers-029.jpg


Color de titulos :

#333


Sombra titulo :

1px 1px 1px #fff


Mensajes :

300


Puntos :

334


Me gusta :

26


ingreso :

30/03/2015


Sexo :

Masculino

Plataforma :

PhpBB3


Navegador :

Chrome


Ver perfil de usuario

Volver arriba Ir abajo

 En la misma categoria


Permisos de este foro:
No puedes responder a temas en este foro.