Mantener visible tooltip de jqueryui

Bueno...después de mucho luchar... encontré la solución...

Gracias a

Funciona... no estoy seguro si es muy eficiente... pero de que funciona... funciona...

Espero les sirva este tooltip sin que se oculte.

var selectorTooltip = "input";

$(selectorTooltip).bind( "mouseleave", function( event ) {
event.stopImmediatePropagation();

var fixed = setTimeout('$("' + selectorTooltip +'").tooltip("close")', 500);

$(".ui-tooltip").hover(
   function(){clearTimeout (fixed);},
   function(){$(selectorTooltip).tooltip("close");}
);
}).tooltip({
    hide: {
        effect: 'explode'// added for visibility
    } 
});

Sean felices! :) Y siéntanse libres de opinar ;)

Autoajustar al ancho de la pantalla un jquery dialog

El jquery dialog por defecto abre pequeñito... pero aveces necesitamos que sea tan grande como el ancho de la ventana del navegador... así como también el alto.... Entonces aquí coloco el código de como abrir un popup y posteriormente autoajustarlo al ancho de la pantalla.

//agregar modal tipo iframe para gestionar certificado
    $("#dialogManagement").dialog({
        autoOpen: false,
        resizable: false,
        modal: true,
        width: 20,
        height: 20,
        responsive: true,
        open: function (ev, ui) {
            $('#iframeManagement').attr('src', 'http://www.google.com');

            $("#dialogManagement").dialog("option", "height", $(window).height() * 0.95);
          $("#dialogManagement").dialog("option", "width", $(window).width() * 0.95);

           $("#dialogManagement").css('overflow', 'hidden'); //SI ES UN IFRAME LO QUE ABRE OCULTA UN SCROLL
        }
    });

    $('#dialogManagement').dialog('open');

Sean felices! :) Y siéntanse libres de opinar ;)

Abrir iframe en popup con jquery dialog

A veces necesitamos abrir un popup y dentro de este un iframe... entonces este sería el código:

//agregar modal tipo iframe
    $("#dialogManagement").dialog({
        autoOpen: false,
        resizable: false,
        modal: true,
        width: 20,
        height: 20,
        responsive: true,
        open: function (ev, ui) {
            $('#iframeManagement').attr('src', 'http://www.google.com');

        }
    });

    $('#dialogManagement').dialog('open');

Espero les sirva.

Sean felices! :) Y siéntanse libres de opinar ;)

Colocar ancho a un progressbar de jqueryui

Para mostrar un ancho definido a un progress bar podríamos tener lo siguiente:

HTML

<div id="progressbar">
</div>

JAVASCRIPT
Inicialización:

$("#progressbar").progressbar({
                    value: 0
                });
$("#progressbar").children().html('<div class="ui-progressbar-overlay"></div>'); //animacion de barra de progreso según valor

Modificar tamaño y color de progressbar por javascript

var progressbar = $("#progressbar"),
                progressbarValue = progressbar.find(".ui-progressbar-value");

            if (progressbar.children().length > 0) {
                //seteando valor
                progressbar.progressbar("option", { value: 50 });
                //seteando color
                progressbarValue.css({ "background": '#' + color });
            }


Sean felices! :) Y siéntanse libres de opinar ;)

Mostrar alert bonito con jquery-ui

para hacer nuestros alerts bonitos podemos hacer lo siguiente:

Tener los siguientes llamados en el head:

 <link rel="stylesheet" type="text/css" media="screen" href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.10.0/themes/redmond/jquery-ui.css" />

<script src="http://ajax.microsoft.com/ajax/jquery/jquery-1.9.0.min.js" type="text/javascript"></script>

    

<script src="jquery-ui.min.js"></script>

<style>

        .errorMessage

        {

            font-size:11px;

        }

    </style>

Y la funcion javascript para mostrar el popup bonito es:

function mostrarPopupBonito(errorTitle, errorText, sizeFont) {

            // crear un temporar popup

            var window = $('<div  title="' + errorTitle + '"><span id="dialogMsg">' + errorText + '</span></div>');

            // mostrar el popup

            window.dialog({

                modal: true,

                dialogClass: "errorMessage"

            });

        }

Sean felices! :) Y siéntanse libres de opinar ;)