has ejemplos jquery lightbox fancybox

ejemplos - tooltip jquery



¿Qué biblioteca de superposición de jquery es la mejor? (5)

He usado lightbox y fancybox bastante, pero nunca he visto ninguna razón para elegir una sobre otra. También hay un montón que no he usado como estos http://planetozh.com/projects/lightbox-clones/ . Los datos en esa página son bastante antiguos y en muchos casos son incorrectos.

¿Hay buenas razones para elegir una sobre las otras? Rendimiento, opciones API, facilidad de personalización, etc.

Esta es más una cuestión subjetiva que una pregunta en blanco y negro. No he visto ninguna comparación en este tema, no sé dónde más preguntar esto.

edit Después de ver las sugerencias, creo que fancybox tiene la mejor api y solo tiene 5kb gzipped. http://fancybox.net/api Colorbox también se ve muy bien.

Consejo de usabilidad : si piensa en capturar las opiniones de los usuarios de una superposición de robo de enfoque, no. Qué sucede si el usuario necesita ver información en la ventana principal para completar su formulario, ahora están atrapados. A veces, estas ventanas emergentes son apropiadas, pero la mayoría de las veces un elemento de bloque de deslizamiento haría el trabajo mejor.


Acabo de marcar ColorBox y Findout tiene 1000 líneas de código para agregar una superposición. algunas veces, todo lo que quiero es simplemente abrir el contenido de un elemento (por ejemplo, div) en el centro de la página y el complemento como colorBox es una exageración definitiva para estas tareas simples.

Lo mejor para una tarea tan simple (información sobre herramientas, superposición, etc.) es crear su propio complemento:

(function($, global) { "use strict"; $.fn.cOverlay = function(contentClass) { var contentItems = contentClass || ''.cOverlay''; var template = $(''<div class="overlay"><div class="content"><div class="close">close</div></div></div>''); var overlay = template.css({ ''position'': ''absolute'', ''width'': ''100%'', ''height'': ''100%'', ''backgroundColor'': ''#555'', ''top'': ''0'', ''left'': ''0'', ''display'': ''none'' }); var content = template.find(".content").css({ ''float'': ''left'', ''backgroundColor'': ''#fff'' }); var close = template.find(".close"); content.append($(contentItems)); $(contentItems).show(); this.click(function() { overlay.show(); content.show(); var height = $(document).height() / 2 - content.height() / 2; var width = $(document).width() / 2 - content.width() / 2; content.css(''marginTop'', height); content.css(''marginLeft'', width); return false; }); content.click(function(e) { e.stopPropagation(); return false; }); close.click(function() { overlay.hide(); content.hide(); return false; }); overlay.click(function() { overlay.hide(); content.hide(); return false; }); $(window).resize(function() { var height = $(document).height() / 2 - content.height() / 2; var width = $(document).width() / 2 - content.width() / 2; content.css(''marginTop'', height); content.css(''marginLeft'', width); }); $(''body'').append(template); }; })(jQuery, window); $ = jQuery;

Aquí está mi versión de superposición simple.


Encontré esta pregunta, tratando de tomar una decisión sobre qué hacer con mi nuevo marco. Fancybox2 está ahora en una licencia no comercial, así que realmente quería convencerme con colorbox u otra alternativa y ahorrar algunos centavos, pero también encontré este enlace http://jsperf.com/colorbox-vs-fancybox y parece que colorbox no es Ganar en la comparación de rendimiento, no por mucho tiempo, aunque esta comparación utiliza versiones obsoletas de ambos.


Siempre he tenido buena suerte con ThickBox , pero tampoco he ThickBox mucho con ninguno de los otros. Me gusta esa debido a la facilidad de implementación. Sript.aculo.us para ProtoType también tiene muchas características asombrosas para las superposiciones, pero a veces siento que ProtoType es un poco torpe para trabajar con ... Mi opinión personal, sin embargo.

Sin embargo, asumo que la mayoría de las diferentes implementaciones de superposiciones para jQuery usan las mismas funciones subyacentes en el marco, por lo que probablemente será difícil ver una diferencia de rendimiento real entre, por ejemplo, ThickBox y LightBox. El verdadero juez del desempeño sería el propio marco.

Hay varios sitios por ahí que comparan los distintos marcos de javascript. Aquí hay uno . Comenzaría a buscar allí y una vez que encuentre un buen marco, entonces céntrese en qué complemento de superposición es más fácil de implementar y tiene las características que necesita. Lo siento, sé que realmente no responde a tu pregunta, pero al menos, espero que ayude :)