You can create a convenient and intuitive navigation on the site using links. This technique allows you to make the user's stay on the resource pages as comfortable as possible.
Instructions
Step 1
Any link is created using a tag that must be closed with. The page address is indicated in quotes after the href attribute. The result should be something like this:
Website
Go to photo gallery
To navigate to a page present in the Internet space, indicate its address, for example, KakProsto.ru. To connect to the html file on your computer, write the path to it. Ideally, it is advisable to switch to English in order to eliminate long entries that arise when copying a Russian-language text with its subsequent translation into the required format. For example, file: /// 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"
Step 2
The link can be set in the form of a picture. To do this, enclose the image between the and: tags. To open a full-fledged illustration of a larger size when you hover over a small icon, you need to use a bunch.
To organize the alternate change of pictures, each of which will be presented as a link and lead to different pages, use the code:
Website
div # rotator {position: relative; height: 150px; margin-left: 15px;}
div # rotator ul li {float: left; position: absolute; list-style: none;}
div # rotator ul li.show {z-index: 500;}
function theRotator () {
$ ('div # rotator ul li'). css ({opacity: 0.0});
$ ('div # rotator ul li: first'). css ({opacity: 1.0});
setInterval ('rotate ()', 5000);
}
function 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 next = $ (sibs [rndNum]);
next.css ({opacity: 0.0})
.addClass ('show')
.animate ({opacity: 1.0}, 1000);
current.animate ({opacity: 0.0}, 1000)
.removeClass ('show');
};
$ (document).ready (function () {
theRotator ();
});
Step 3
In order for the page to which the link leads to open in a separate window, you must add the attribute: Go.
Step 4
If the html document is too long, then you can put links inside it. For example, at the very beginning, you can make a table of contents, and when you click on a specific heading, the user will move to the desired part of the page. To do this, you need to register a link with a # icon: Go to the section and create bookmarks to the links: Section.
It will look like this:
Website
Link to section
Section