Transiciones de página en sitios web?

Me preguntaba si hay algún método para crear efectos de transición agradables y suaves al navegar entre páginas. Cosas como efectos ciegos, efectos deslizantes, etc. Supongo que estoy buscando algo así como lo que jQuery puede hacer con las imágenes, pero para las páginas web reales. Sé que hay efectos de desvanecimiento y todo eso, pero me preguntaba si había algo más ‘moderno’ por ahí. Aunque me doy cuenta de que Flash sería una buena opción para esto, no es una opción.

Puedes hacer algunos efectos geniales si usas jQuery UI. Serán mucho más suaves si carga todo al usar AJAX … pero, he aquí un ejemplo para que funcione con cargas de página completa.

Primero, debe incluir adicionalmente jQuery UI (yo solo construí el mío y solo obtuve los efectos que necesitaba):

 

Y aquí está el javascript que necesitarás para que funcione.

 $(function() { $('body').hide(); $('a').bind('click', function() { var newPage = $(this).attr('href'); $('body').hide('blind',{},500, function() { newPageParts = newPage.split('?'); newPageURL = newPageParts[0]; newPageParams = newPageParts[1]; newPage = newPageURL+"?transition=true"+(newPageParams != undefined ? "&"+newPageParams : ''); window.location=newPage; }); return false; }); if(getURLParam('transition') != '') { $('body').show('blind',{},500,null); } }); function getURLParam(strParamName){ var strReturn = ""; var strHref = window.location.href; if ( strHref.indexOf("?") > -1 ){ var strQueryString = strHref.substr(strHref.indexOf("?")).toLowerCase(); var aQueryString = strQueryString.split("&"); for ( var iParam = 0; iParam < aQueryString.length; iParam++ ){ if (aQueryString[iParam].indexOf(strParamName + "=") > -1 ){ var aParam = aQueryString[iParam].split("="); strReturn = aParam[1]; break; } } } return strReturn; } 

Por supuesto, desvanecerse solo va a funcionar en las páginas que tienen esta secuencia de comandos …

Solo una nota: hice un poco de esto en unos minutos, así que podría ser realmente un gueto. Pero, funciona … así que … sí …

IE tiene una implementación muy simple de los efectos de transición de página , pero no creo que funcionen en otros navegadores como Mozilla y Safari.