<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Слайдинг ефект на съдържание</title>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
//скриваме всичките <div>-ове освен първия
$('.msg_body:not(:first)').hide();
//като връзката е кликната
$("a.linkclass").click(function()
{
//проверява времто на видимия блок и кликва на линка на блок-а ако е еднакъв или различен
if($(this).attr("href")!="#"+$(".msg_body:visible").attr("id"))
{
//възтановяваме z-index-а и margin-а на лявата страна и увеличава и намаляме с 400пиксела и скриваме
$(".msg_body:visible").css("z-index","0").animate({marginLeft: "-=400px"},"500").animate({marginLeft: "+=400px"},"500").hide("1");
//увеличаваме z-index-а на новия видим блок
$($(this).attr("href")).css("z-index","10").fadeIn(400);
}
});
});
</script>
<style type="text/css">
body {
font: 12px Verdana,Arial, Helvetica, sans-serif;
margin: 10px auto;
width:350px;
}
.container {
width:312px;
margin-top:20px;
}
.msg_body {
border:1px solid #FFFF99;
padding: 5px;
width: 300px;
background-color:#FFFFCC;
text-align:justify;
position:absolute;
}
.linkclass
{
font-weight:bold;
color:#006699;
}
</style>
</head>
<body>
<a href="#home" class="linkclass" >Какво е Loren Ipsum?</a> <br />
<a href="#about_us" class="linkclass" >Откъде произлиза?</a> <br />
<a href="#service" class="linkclass" >Защо го използваме?</a> <br />
<a href="#contact_us" class="linkclass" >Откъде да го взема?</a>
<div class="container">
<div id="home" class="msg_body"> <b>Какво е Loren Ipsum?</b><br /> е елементарен примерен текст, използван в печатарската и типографската индустрия. Lorem Ipsum е индустриален стандарт от около 1500 година, когато неизвестен печатар взема няколко печатарски букви и ги разбърква, за да напечата с тях книга с примерни шрифтове. Този начин не само е оцелял повече от 5 века, но е навлязъл и в публикуването на електронни издания като е запазен почти без промяна. Популяризиран е през 60те години на 20ти век със издаването на Letraset листи, съдържащи Lorem Ipsum пасажи, популярен е и в наши дни във софтуер за печатни издания като Aldus PageMaker, който включва различни версии на Lorem Ipsum.
</div>
<div id="about_us" class="msg_body"> <b>Откъде произлиза?</b><br /> Противно на всеобщото вярване, Lorem Ipsum не е просто случаен текст. Неговите корени са в класическата Латинска литература от 45г.пр.Хр., което прави преди повече от 2000 години. Richard McClintock, професор по Латински от колежа Hampden-Sydney College във Вирджиния, изучавайки една от най-неясните латински думи "consectetur" в един от пасажите на Lorem Ipsum, и търсейки цитати на думата в класическата литература, открива точния източник. Lorem Ipsum е намерен в секции 1.10.32 и 1.10.33 от "de Finibus Bonorum et Malorum"(Крайностите на Доброто и Злото) от Цицерон, написан през 45г.пр.Хр. Тази книга е трактат по теория на етиката, много популярна през Ренесанса. Първият ред на Lorem Ipsum идва от ред, намерен в секция 1.10.32.
Стандартният отрязък от Lorem Ipsum, използван от 1500 г. насам, е поместен по-долу за тези, които се интересуват. Секции 1.10.32 и 1.10.33 от "de Finibus Bonorum et Malorum" на Цицерон също са поместени в оригиналния им формат, заедно с превода им на английски език, направен от H. Rackham през 1914г.
</div>
<div id="service" class="msg_body"> <b>Защо го използваме? </b><br /> Известен факт е, че читателя обръща внимание на съдържанието, което чете, а не на оформлението му. Свойството на Lorem Ipsum е, че до голяма степен има нормално разпределение на буквите и се чете по-лесно, за разлика от нормален текст на английски език като "Това е съдържание, това е съдържание". Много системи за публикуване и редактори на Уеб страници използват Lorem Ipsum като примерен текстов модел "по подразбиране", поради което при търсене на фразата "lorem ipsum" в Интернет ще бъдат открити много сайтове в процес на разработка. Някой от тези сайтове биват променяни с времето, а други по случайност или нарочно(за забавление и пр.) биват оставяни в този си незавършен вид.
</div>
<div id="contact_us" class="msg_body"> <b>Откъде мога да го взема? </b><br /> Съществуват много вариации на пасажа Lorem Ipsum, но повечето от тях са променени по един или друг начин чрез добавяне на смешни думи или разбъркване на думите, което не изглежда много достоверно. Ако искате да използвате пасаж от Lorem Ipsum, трябва да сте сигурни, че в него няма смущаващи или нецензурни думи. Всички Lorem Ipsum генератори в Интернет използват предефинирани пасажи, който се повтарят, което прави този този генератор първия истински такъв. Той използва речник от над 200 латински думи, комбинирани по подходящ начин като изречения, за да генерират истински Lorem Ipsum пасажи. Оттук следва, че генерираният Lorem Ipsum пасаж не съдържа повторения, смущаващи, нецензурни и всякакви неподходящи думи. </div>
</div>
</body>
</html>
