cBB Blockgets + Tooltip


no_avatar
Makoto
 
Posts: 60
Joined: Tue Apr 10, 2012 3:07 am
 Wed Apr 23, 2014 2:38 pm • via Web
usar el efecto toolip de jquery dentro del foro?

el jquery que usa cBB Blockgets tiene el tooltip?
User avatar
IvanPF
Administrator
 
Posts: 2010
Joined: Fri Jun 17, 2011 12:15 am
Location: España (Spain)
 Tue Apr 29, 2014 10:58 am • via Web
Hola

El "tooltip" no viene por defecto con jQuery, viene con jQueryUI.
cBB blockgets no usa el jQueryU completo (solo usa el método "sortable" en el acp)I por lo que no lo tiene por defecto. No obstante, si quieres poner el jQueryUI dentro de la librería (jblockgets) del mod tienes que añadir la url del archivo js de jQueryUI en el archivo "/blockgets/includes/default_headers.php" justo después de la línea de jQuery.
Si subes el archivo de jQueryUI a la carpeta /blockgets/assets/js/ (en donde esta el jquery de cBB Blockgets), el archivo "default_headers.php" te quedaría así:
Code: Select all
   array('js', 'jquery.min.js', 'blockgets', '', '1.11.0'),
   array('js', 'jqueryui.min.js', 'blockgets', '', '1.11.0'),
   array('js', 'jquery-ui-sortable.min.js', 'admin', '', '1.10.4'),


Si quieres usar el jqueryui desde un servidor externo (como google) la línea a añadir sería algo así:
Code: Select all
array('js', 'http://la_url_del_servidor.com/jqueryui.min.js', 'external'),
no_avatar
Makoto
 
Posts: 60
Joined: Tue Apr 10, 2012 3:07 am
 Sat May 10, 2014 11:55 pm • via Web
Buenas me funciono con el tooltip pero ahora que quiero hacer una ventana modal, osea que al darle click a un boton aparesca una ventana pero me dice "r is undefined" con el archivo blockgets.js

quiero que sea la funcion se de al dar clic en "identificarse"

http://www.fiis-unac.com/foro/

el codigo js que uso es este

Code: Select all
<script type="text/javascript">
// <![CDATA[
   jblockgets(function($) {
      $("#dialog").dialog(   {
         modal: true,         
         autoOpen: false,
         width: 300,
         resizable: false,
         show: "fade",
         hide: "explode",
         buttons: {
            '{L_CLOSE_WINDOW}': function() {
               $( this ).dialog( "close" );
            }
         }
      });
      
//this section is for the buttons. styling and what happens     
      $("input:submit, a, button", ".uibutton").button();
      $("a", ".uibutton").click(function() { return true; });
//This is the section for what happens when you press the button     
      $( "#openera" ).click(function() {
         $("#dialog").dialog("open");
         return false;
      });
//this section is for closing the dialogue by clicking anywhere on the overlay     
      $('body').on("click", ".ui-widget-overlay", function()   {
         $("#dialog").dialog("close");
      });
   });
// ]]>
</script>


el html de la ventana es este

Code: Select all
   <div id="loginfromui" class="" style="display: none;">
      <div id="dialog" class="" title="Welcome Back, we have missed you!">
      <form method="post" class="" action="{S_PRIME_QUICK_LOGIN}">
         <fieldset>     
            <p></p>
            <p><span class="ui-icon ui-icon-circle-arrow-e" style="float:left;"></span>&nbsp;{L_PRIME_QUICK_LOGIN_USERNAME}:&nbsp;&nbsp;<input class="ui-state-default ui-corner-all" id="username" name="username" title="{L_PRIME_QUICK_LOGIN_USERNAME}" type="text"/></p>
            <p><span class="ui-icon ui-icon-circle-arrow-e" style="float:left;"></span>&nbsp;{L_PRIME_QUICK_LOGIN_PASSWORD}:&nbsp;&nbsp;<input class="ui-state-default ui-corner-all" id="password" name="password" title="{L_PRIME_QUICK_LOGIN_PASSWORD}" type="password"/></p>
            <p class="uibutton"><input class="" type="submit" name="login" value="{L_LOGIN}"/>{S_LOGIN_REDIRECT}</p>
            <!-- IF S_PRIME_QUICK_LOGIN_AUTO --><p><span class="ui-icon ui-icon-circle-arrow-e" style="float:left;"></span>{L_PRIME_QUICK_LOGIN_REMEMBER}&nbsp;<input type="checkbox" name="autologin" id="prime_login_auto"/></p><!-- ENDIF -->
            <!-- IF S_PRIME_QUICK_LOGIN_HIDE --><p><span class="ui-icon ui-icon-circle-arrow-e" style="float:left;"></span>{L_PRIME_QUICK_LOGIN_HIDE} <input type="checkbox" name="viewonline" id="prime_login_hide"/></p><!-- ENDIF -->
         </fieldset>
      </form>
        </div>
   </div>


Claro que en llamo a estos archivos

Code: Select all
array('js', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js', 'external'),
   array('css', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/redmond/jquery-ui.css', 'external'),


quiero hacer algo asi
Image

si podes ayudarme u_u con el codigo de la ventana, pero creo que mas importante es como lklamar a la funcion
User avatar
IvanPF
Administrator
 
Posts: 2010
Joined: Fri Jun 17, 2011 12:15 am
Location: España (Spain)
 Thu May 15, 2014 5:46 pm • via Web
Hola

El código js puede que esté bien pero creo que estás generando una incompatibilidad y te explico el porqué.
cBB blockgets tiene su propio "dialog", "accordion", etc.. (no usa los de jQueryUI porque no sirven para hacerlo).
Cuando tú añades el archivo "http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js" estás añadiendo todos los "widgets" de jQueryUI sobreescribiendo los de cBB Blockgets y creando un problema.

Deberías añadir sólo una librería para el jquery tooltip pero sin incluir los demás widgets (dialog, accordion, etc..) y usar los que trae cBB Blockgets (que creo que te sirven igual para lo que quieres hacer)

La otra alternativa sería hacerlosin la librería de cBB Blockgets.

Who is online

Users browsing this forum: No registered users and 0 guests