Можете да създадете удобна и интуитивна навигация в сайта, като използвате връзки. Тази техника ви позволява да направите престоя на потребителя на страниците с ресурси възможно най-удобен.
Инструкции
Етап 1
Всяка връзка се създава с помощта на таг, който трябва да бъде затворен. Адресът на страницата е посочен в кавички след атрибута href. Резултатът трябва да бъде нещо подобно:
Уебсайт
Отидете в галерията със снимки
За да отидете на страница, присъстваща в интернет пространството, посочете нейния адрес, например KakProsto.ru. За да се свържете с html файла на вашия компютър, напишете пътя към него. В идеалния случай е препоръчително да преминете към английски, за да елиминирате дълги записи, които възникват при копиране на текст на руски език с последващия му превод в необходимия формат. Например файл: /// E: /% D0% A3% D1% 87% D0% B5% D0% B1% D0% B0 / XXX% 20% D0% BF% D0% B0% D0% BF% D0% BA% D0% B0 /% D1% 81% D0% B0% D0% B9% D1% 82% 29% 29% 29/11% 20% D1% 81% D1% 82% D1% 80% 20% D1% 80 % D0% B0% D0% B7% D0% BD% D0% BE% D0% B5 /% D0% BE% D0% B1% D0% BE% 20% D0% B2% D1% 81% D0% B5% D0% BC% 20% D0% B3% D0% BB% D0% B0% D0% B2% D0% BD% D0% B0% D1% 8F.html"
Стъпка 2
Връзката може да бъде зададена под формата на картинка. За целта затворете изображението между етикетите и:. За да отворите пълноценна илюстрация с по-голям размер, когато задържите курсора на мишката върху малка икона, трябва да използвате куп.
За да организирате алтернативна промяна на снимки, всяка от които ще бъде представена като връзка и ще доведе до различни страници, използвайте кода:
Уебсайт
div # rotator {позиция: относителна; височина: 150px; поле вляво: 15px;}
div # rotator ul li {float: ляво; позиция: абсолютна; списък-стил: няма;}
div # rotator ul li.show {z-index: 500;}
функция theRotator () {
$ ('div # rotator ul li'). css ({непрозрачност: 0.0});
$ ('div # rotator ul li: first'). css ({непрозрачност: 1.0});
setInterval ('rotate ()', 5000);
}
функция rotate () {
var current = ($ ('div # rotator ul li.show')? $ ('div # rotator ul li.show'): $ ('div # rotator ul li: first'));
var next = ((current.next (). length)? ((current.next (). hasClass ('show'))? $ ('div # rotator ul li: first'): current.next ()): $ ('div # rotator ul li: first'));
// var sibs = current.siblings ();
// var rndNum = Math.floor (Math.random () * sibs.length);
// var следващ = $ (sibs [rndNum]);
next.css ({непрозрачност: 0.0})
.addClass ('шоу')
.animate ({непрозрачност: 1.0}, 1000);
current.animate ({непрозрачност: 0.0}, 1000)
.removeClass ('show');
};
$ (документ).ready (функция () {
theRotator ();
});
Стъпка 3
За да може страницата, към която води връзката, да се отвори в отделен прозорец, трябва да добавите атрибута: Go.
Стъпка 4
Ако html документът е твърде дълъг, можете да поставите връзки вътре в него. Например в самото начало можете да направите съдържание и когато щракнете върху определено заглавие, потребителят ще се премести в желаната част от страницата. За да направите това, трябва да регистрирате връзка с икона #: Отидете в раздела и създайте отметки към връзките: Раздел.
Ще изглежда така:
Уебсайт
Връзка към раздел
Раздел
