Для одного проекта нужно сделать пвсевдо аякс для перезагрузки страниц на сайте
То есть с эффектом затухания и появления при переходе ото одной странице к другой
Цена и срок
$("#mask").css("display", "block"); $("#mask").fadeOut(1000); $("a").click(function(event){ event.preventDefault(); linkLocation = this.href; $("#mask").fadeIn(1000, redirectPage); }); function redirectPage() { window.location = linkLocation; }
<div id="mask" style="position: absolute; display: none; width: 100%; height: 100%; top: 0; left: 0; background-color: #bbb; z-index: 20;"></div>
1. нужно исправить стили для body
body { display: none; }
<script type="text/javascript"> $(document).ready(function() { $("body").css("display", "none"); $("body").fadeIn(2000); }); </script>
Теперь осталось добавить событие для ссылок чтобы сделать переходы. и в конечном счете наш скрипт немного видоизменится и примет вот такой законченный вариант.
<script type="text/javascript"> $(document).ready(function() { $("body").css("display", "none"); $("body").fadeIn(2000); $("a.transition").click(function(event){ event.preventDefault(); linkLocation = this.href; $("body").fadeOut(1000, redirectPage); }); function redirectPage() { window.location = linkLocation; } }); </script>
html { /*используйте этот цвет, если у Вас фон черный или около того*/ background-color: #000000; }
Можно расписать для чайников по пунктно что куда в какие файлы:)