Jump to content
  • Sky
  • Blueberry
  • Slate
  • Blackcurrant
  • Watermelon
  • Strawberry
  • Orange
  • Banana
  • Apple
  • Emerald
  • Chocolate
  • Charcoal
Miguel92

[Mini-Mod] Mostrar/Ocultar password

Recommended Posts

On 8/8/2017 at 7:49, Rhuan dijo:

Te has complicado bastante la vida. Mostrar la contraseña es tan simple como cambiar el atributo type del input de password a text.

$('#vermipass').click(function(){
    var newType = $('#password').attr('type') == 'text' ? 'password' : 'text';
    $('#password').attr('type', newType);
});

 

Ahora si me funciona correctamente, ya que estoy pasando mi theme de Bootstrap 3 a Bootstrap 4 y realice la actualización del jquery, js 

Compartir este post


Enlace al post
Compartir en otros sitios

Registra una cuenta o conéctate para comentar

Debes ser un miembro de la comunidad para dejar un comentario


  • Similar Content

    • Por Miguel92
      [SnackBar] Toaster para tu theme
       
      Bueno como dice el titulo es un complemento que puede ir a cualquier theme sin importar que formato, frameworks,etc tenga.
      Si quieren saber del tema o conocer el complemento visiten snackbarjs
       
      Ejemplo como les puede quedar:
      1 - INICIANDO SESIÓN CON UN USUARIO QUE NO EXISTE
      2 - INICIANDO SESIÓN CON CONTRASEÑA ERRONEA

       
      3 - CUANDO AGREGAS UN POST A FAVORITOS
      4 - CUANDO YA TIENES EL POST EN FAVORITOS

       
      ¿Que es lo que hace?
       - Simplemente da una mejor forma de verlo y además queda bonito. (Se que no todos tenemos la misma opinion)
       - Reemplaza el tipico mensaje estatico que tiene por defecto.
       
      ¿Solo sirve con los .tpl?
       - Por suerte no hace falta que sea solamente en los js y ni en los .tpl, se pueden agregar tanquilamente en los archivos php.
       
      ¿Es mucho lo que hay que modificar?
       - Hay que reemplazar donde se de una notificación estatica, como se los demostre en las imagenes fuerón agregados en los archivos c.posts.php y c.user.php
       
      ¿Se le puede cambiar de estilos?
      - Si tranquilamente no hay problema.
       
    • Por Miguel92
      Desgraciadamente lo tengo para mi theme MozzFire v.4.x
       Así que les dejaré un diseño que se adapta a cualquier theme!
       
      Obviamente deben tener el mod [Mod] Localización del usuario en tu web V1
      Por: @Kmario19

      Luego hacemos lo siguiente 
      1 - Vamos a inc/php/ajax/ y crearemos un archivo llamado ajax.localizacion.php y en el colocaremos lo siguiente:
      <?php if ( ! defined('TS_HEADER')) exit('No se permite el acceso directo al script'); /**  * Controlador AJAX  *  * @name    ajax.localizacion.php  * @author  @Miguel92 */ // NIVELES DE ACCESO Y PLANTILLAS DE CADA ACCIÓN $files = array(      'localizacion' =>  array('n' => 0, 'p' => 'localizacion'),  ); // REDEFINIR VARIABLES $tsPage = 'php_files/p.'.$files[$action]['p']; $tsLevel = $files[$action]['n']; $tsAjax = empty($files[$action]['p']) ? 1 : 0; // DEPENDE EL NIVEL $tsLevelMsg = $tsCore->setLevel($tsLevel, true); if($tsLevelMsg != 1) {      echo '0: '.$tsLevelMsg['mensaje'];      die(); // En el caso de error matamos la operación! } // CODIGO switch($action){     case 'localizacion':         $smarty->assign("tsLocalizacion",$tsLoc->getLocalizacion());     break; }  
      2 - Luego vamos a tu_theme/js/acciones.js y abajo de todo pegamos (Puedes ver el mismo código más reducido se encuentra al final del topic)
      /*      ==== Actualizar localizacion por ajax ====     ====          :: 12/05/2018 ::       ====     ====            By @Miguel92        ==== */ function localizar(userid){           $.ajax({                type: 'POST',                url: global_data.url + '/localizacion.php',             data: 'userid=' + userid,                cache: false,                success: function(h){                   $('#localizar').html(h);                   $('#localizar').html(h);             },                error: function(){                   $('#localizar ul').text("No se pueden cargar los usuarios. Lo lamento!");             }         }); } setInterval(function(){ localizar(); },6000); // El intervalo en que se actualizará! (6s)  
      3 - Luego vamos a tu_theme/templates/t.php_files/ y creamos un archivo llamado p.localizacion.tpl y pegamos
      {if $tsLocalizacion.data}     {foreach from=$tsLocalizacion.data item=l}         <tr>             <td>                 {if $l.id_user == 0}                 <img src="{$tsConfig.url}/files/avatar/{$l.id_user}_120.jpg" width="40" height="40" alt="{$l.user_name}"/>                 {else}                 <img src="{$tsConfig.url}/files/avatar/{$l.id_user}_120.jpg" width="40" height="40" alt="{$l.user_name}"/>                 {/if}             </td>             <td style="text-align: left;color:#2186D6;">                 {if $l.id_user == 0}                  Visitante                 {else}                 <a href="{$tsConfig.url}/perfil/{$l.user_name}" title="Ver perfil de {$l.user_name}" style="color:#2186D6;">{$l.user_name}</a>                 {/if}             </td>             <td>                 {if $l.tipo == 1}                     {$l.titulo} {$tsConfig.titulo}                 {elseif $l.tipo == 2}                     Viendo el post <a href="{$tsConfig.url}/{$l.url}" title="{$l.titulo}">{$l.titulo}</a>                 {elseif $l.tipo == 3}                     {$l.titulo} <a href="{$tsConfig.url}/perfil/{$l.url}" title="Ver perfil de {$l.url}" data-vcard="{$l.lugar}">{$l.url}</a>                 {elseif $l.tipo == 5}                     Viendo la foto <a href="{$tsConfig.url}/{$l.url}" title="{$l.titulo}">{$l.titulo}</a>                 {elseif $l.tipo == 6}                 Viendo el <a href="{$tsConfig.url}/{$l.url}" title="{$l.titulo}">album</a> de fotos de <a href="{$tsConfig.url}/perfil/{$l.titulo}" title="{$l.titulo}">{$l.titulo}</a>                 {elseif $l.tipo == 7}                     {$l.titulo} <a href="{$tsConfig.url}/top/{$l.url}/" title="{$l.url}">{$l.url}</a>                 {elseif $l.tipo == 8}                 {$l.titulo} <a href="{$tsConfig.url}/top/{$l.url}/" title="{$l.url}">{$l.url}</a>                 {elseif $l.tipo == 13}                 {$l.titulo} <a href="{$tsConfig.url}/{$l.url}/" title="Mi">Portal</a>                 {elseif $l.tipo == 17}                 {$l.titulo} <a href="{$tsConfig.url}/pages/{$l.url}/" title="Chat">Chat</a>                 {else}                     {$l.titulo}                 {/if}             </td>             <td>{$l.fecha|hace}</td>         </tr>    {/foreach} {else}     <tr>         <td colspan="3" style="padding:10px">Los usuarios no hacen actividad, procura... -yao</td>     <tr> {/if}  
      4 - Luego abrir y reemplazar tu_theme/templates/t.localizacion.tpl por este
      {include file='sections/main_header.tpl'}                     <div class="loc-contenedor">     <div class="loc-tarjeta">         <div class="loc-encabezado">             <h5>Localización de los usuarios</h5>         </div>         <div class="loc-cuerpo">         <table class="loc-tabla">             <thead>                 <tr>                     <th>Avatar</th>                     <th>Usuario</th>                     <th>Localización</th>                     <th>Tiempo</th>                 </tr>             </thead>                                     <tbody id="localizar">             </tbody>             <tfoot>                                 {if $tsLocalizacion.inicio > 0 || $tsLocalizacion.hay == $tsLocalizacion.limite}                     <tr>                         <td colspan="4">                         {if $tsLocalizacion.inicio > 0}                             <a class="loc-boton" href="{$tsConfig.url}/localizacion/?l={$tsLocalizacion.inicio-$tsLocalizacion.limite}">Anterior</a>                         {/if}                         {if $tsLocalizacion.hay == $tsLocalizacion.limite}                             <a class="loc-boton" href="{$tsConfig.url}/localizacion/?l={$tsLocalizacion.inicio+$tsLocalizacion.limite}">Siguiente</a>                         {/if}                         </td>                     </tr>                 {/if}             </tfoot>         </table>         </div>     </div>                     </div> {include file='sections/main_footer.tpl'} 5 - Por último agregan el css donde quieran
      .loc-contenedor {     width: 95%;     margin: 0 auto;     margin-top: 15px;     margin-bottom: 15px; } .loc-tarjeta .loc-encabezado {     padding: 6px 0;     text-align: center; } .loc-tarjeta .loc-encabezado h5 {     font-size: 2.5em;     margin: 0;     padding: 0; } .loc-tarjeta .loc-cuerpo {     padding-top: 0!important; } .loc-tarjeta .loc-cuerpo .loc-tabla {     width: 80%;     margin: 0 auto;     padding: 4px;     text-align: center; } .loc-tarjeta .loc-cuerpo .loc-tabla thead {     font-weight: bold;     font-size: 18px;     border-top: 2px solid #555;     border-bottom: 2px solid #555;     background-color: #EEE; } .loc-tarjeta .loc-cuerpo .loc-tabla tbody td {     padding: 4px 0; } .loc-tarjeta .loc-cuerpo .loc-tabla tbody tr:nth-child(2n+1) {     background-color: #BAFAB8;     transition: all .1s ease-in-out; }     .loc-tarjeta .loc-cuerpo .loc-tabla tbody tr:hover {     background-color: #99BFF8;     transition: all .1s ease-in-out; } .loc-tarjeta .loc-cuerpo .loc-tabla tfoot tr td {     border-top: 2px solid #555;     border-bottom: 2px solid #555;     padding: 12px 0;     text-align: center; }  .loc-tarjeta .loc-cuerpo .loc-tabla tfoot tr td .loc-boton {     border: 1px solid #555;     padding: 6px 20px;     border-radius: 5px;     color: #EEE;     background-color: #17A2A0;     text-transform: uppercase;     text-decoration: none;     transition: all .1s ease-in-out; } .loc-tarjeta .loc-cuerpo .loc-tabla tfoot tr td .loc-boton:hover {     background-color: #0E7675;     transition: all .1s ease-in-out; } ASI LES QUEDARÁ

       
       
       
      También pueden agregarle esto:
      [FIX] Localización de usuarios - filtrado por IP - Risus 1.2 
      Por: @rooteroman
       
       
      PD: Se que me va a pedir una demo, mi respuesta es NO TENGO
      Cualquier problema avisarme!
       
      13/05/2018
      [FIX] En el caso de ser necesario:
      Si por esas casualidades les llegará a funcionar medio raro, en el punto 2 lo pueden hacer de la siguiente manera, en vez de ponerlo en acciones.js lo pueden agregar en templates/sections/main_footer.tpl arriba de 
       
      </body> </html> y allí colocan este código
       
       
      Código reducido para el PASO 2
       
    • Por Miguel92
      Bueno les presento un complemento que lo tengo en demo32.hol.es, lo hice porque el panel de la izquierda era muy tosco y feo así que decidí cambiarlo por el de la derecha si alguien quiere este panel, se los pasaré...lo hago así porque no se si les gustará o si lo usarán o no!
       

       
      Para ello deben tener el conjunto de Glyphicon Halflings aunque también se los dejaré por si acaso!
       
      Si la imagen no se ve haz clic aquí
      Después le haré el mod para que el usuario elija la imagen del fondo desde su cuenta!...
    • Por Miguel92
      Hola, este es un mod/mini-mod/complemento que aplica un background solo en el perfil... he tratado de hacerlo con home, fotos, tops, etc. desde la cuenta, en teoría lo que quería hacer es que los usuarios eligieran las imágenes que querían poner para las secciones ya mencionadas, pero solo logré para el perfil... Si el mod ya existía pido perdón, porque no lo he visto
       
      1) Ejecutar esta consulta
      ALTER TABLE `u_perfil` ADD `p_fondo` VARCHAR(200) NOT NULL;  2) Ir a c.cuenta.php y buscar 
      function loadHeadInfo($user_id){         global $tsUser, $tsCore;         // INFORMACION GENERAL y dentro de esta función buscamos 
      p.p_socials, p.p_empresa, y agregar a lado de esto
      p.p_fondo,  Luego buscar más abajo
      }         // COMPROBAR PORCENTAJE         $total = array(5,8,9,8,9); // CAMPOS EN CADA CATEGORIA         $tid = $save - 1; y arriba agregamos
                  case 9:                 // IN DB                 $perfilData = array(                     'fondo' => $tsCore->setSecure($_POST['fondo']), //Este es para el perfil                 );             break;  
      3) Vamos a estilos.css y en body dentro de las llaves {...} agregaremos esto
          background-position: center center;     background-repeat: no-repeat;     background-attachment: fixed;     background-size: cover;  
      4) Luego buscar tuTheme/templates/t.cuenta.tpl y debajo de 
      <li><a onclick="cuenta.chgtab(this)">Cambiar Nick</a></li> agregamos
      <li><a onclick="cuenta.chgtab(this)">Fondo</a></li> un poco más abajo debajo de
      {include file='modules/m.cuenta_nick.tpl'} agregamos
      {include file='modules/m.cuenta_fondo.tpl'}  
      5) Crearemos el archivo m.cuenta_fondo.tpl y la colocaremos en modules
      <div class="content-tabs fondo" style="display:none">     <fieldset>     <div class="alert-cuenta cuenta-9"></div>              <div class="field" style="padding: 5px 0">             <label for="fondo" style="display: inline-block;">Fondo del Perfil:</label>             <input type="text" value="{$tsPerfil.p_fondo}" maxlength="200" name="fondo" id="fondo" class="text cuenta-save-9" style="width:65%; display: inline-block;">         </div>    </fieldset>                   <div class="buttons">             <input type="button" value="Guardar" onclick="cuenta.save(9)" class="mBtn btnOk"/>         </div>                                      <div class="clearfix"></div> </div>  
      6) Último paso vamos a templates/sections/main_header.tpl y buscamos
      </head> <body> y arriba agregamos
      {literal} <style>     body {         background-image: url({/literal}{$tsInfo.p_fondo}{literal});     } </style> {/literal} RESULTADO FINAL:

       
       
      Para evitar las puntas blancas busquen en estilos.css
       /****** Bordes Redondos ******/  debajo agregan ↓ ↓ ↓ 
      .rtop { border-radius: 11px 11px 0 0; } .rbott { border-radius: 0 0 11px 11px; }  y listo quedará más lindo
      Para el fondo con opaco → ir a sections/main_header.tpl y buscar <body> debajo pegamos
      <div id="background_transparent"></div> y en estilo.css debajo de body { ... } pegamos
      Fondo 1
      #background_transparent {     background-color: rgba(255,255,255,.6);     position: fixed;     height: 100%;     top: 0;     width: 100%;     z-index: -1; } Fondo 2
      #background_transparent {     background-color: rgba(0,0,0,.8);     position: fixed;     height: 100%;     top: 0;     width: 100%;     z-index: -1; } Fondo1                                                           Fondo2

    • Por Miguel92
      [Mini-Mod] Aumentar/Disminuir texto! V.2
      Versión más simplificada...
       
      Hace lo mismo que la V.1 pero esta cuenta solamente con 2 opciones

       
      Descargaremos estas 2 imágenes, y la guardan en la carpeta de images 
       
      Imagen 1 → la guardan como disminuir.png
      Imagen 2 → la guardan como aumentar.png
       
      1) Vamos a sections/main_footer.tpl y arriba de </body> pegamos esto
      <div class="aumendim">   <a href="#" id="increaseFont"><img src="{$tsConfig.images}/aumentar.png" alt=""></a>   <a href="#" id="decreaseFont"><img src="{$tsConfig.images}/disminuir.png" alt=""></a>  </div>  {literal} <style>   .aumendim {     float: left;     position: fixed;     bottom: 20px;     left: 20px;   }   .aumendim a {     padding: 5px;   } </style> {/literal} <script src="{$tsConfig.js}/mix.js" type="text/javascript"></script>  
      2) Luego descargamos este archivo mix.js y lo guardamos en la carpeta tu_theme/js y listo
  • Navegando Recientemente   0 miembros

    No registered users viewing this page.

  • Patrocinador



  • ×