Окно определенного размера.
Оформляется с помощью JavaScript. Обратите внимание на отсутствие пробелов.<a href="URL"onclick="window.open(this.href,this.target,'width=600,height=400,top=50, left=50,'+'toolbar=no,menubar=no,scrollbars=yes,resizable=yes');return false;">анкор</a>, где width - ширина окна в пикселях,
height - высота окна в пикселях,
top - отступ сверху, определяющий размещение в окне браузера,
left - отступ слева, определяющий размещение в окне браузера,
toolbar=no/yes - создаёт рабочие инструменты браузера
menubar=no/yes - создаёт меню вверху окна
scrollbars=no/yes - создаёт горизонтальную и вертикальную полосы прокрутки
,resizable=no/yes - пользователь может изменять размер окна.
Пример:
<a href="http://shpargalkablog.ru/" onclick="window.open(this.href,this.target,'width=400,height=400,top=100, left=50,'+'toolbar=no,menubar=no,scrollbars=yes,resizable=yes');return false;">Заработок с нуля.</a>Результат: Заработок с нуля.
Чтобы человек не прокручивал веб-документ вверх, а одним щелчком по ссылке или кнопке, попадал к началу страницы, нужно в конце URL поставить хэш (символ #): http://shpargalkablog.ru/2010/09/postroenie-ssylok-v-html.html#. Относительный путь выглядит как: #.
<a href="#">анкор</a>
| |
| Пример: | <a href="#">наверх</a>
|
|---|---|
| Результат: | наверх |
Сей элемент с помощью CSS стилей можно зафиксировать на экране и благодаря JavaScript показывать не сразу, а только после прохождения первого экрана (см. подробнее как это сделать).
Чтобы человек не искал по всему документу необходимый материал, чтобы при нажатии на слово был переход не только на желаемую страницу, но в конкретное место на этой странице, следует тегу, к которому нужно перейти, задать id (установить якорь-закладку):
<тег id="имя_закладки">содержание</тег>
| |
| Пример: | <div id="tut">якорь-закладка №1</div>
|
|---|---|
| Результат: | якорь-закладка №1
|
Если закладка находится на той же странице, то ссылку лучше использовать относительную. В атрибуте href перед именем закладки надо указать символ # без пропусков:
<a href="#имя_закладки">анкор</a>
| |
| Пример: | <a href="#tut">ссылка перенесёт к якорю-закладке №1</a>
|
|---|---|
| Результат: | ссылка перенесёт к якорю-закладке №1 |
Если закладка находится на другой странице Сети, то — абсолютную:
<a href="URL#имя_закладки">анкор</a>
| |
| Пример: | <a href="http://shpargalkablog.ru/2014/03/table-of-contents-html5.html#ul">Как сделать список из вопросов, кликнув на один из которых, автоматически перемещаешься на его ответ</a>
|
|---|---|
| Результат: | Как сделать список из вопросов, кликнув на один из которых, автоматически перемещаешься на его ответ |
Если нужно, чтобы страница перематывалась несколько выше якоря-закладки, то тегу, к которому следует перенестись, нужно прописать стиль CSS
| Пример: | <style>
.hash:target:before {
content: "";
display: block;
height: 14em;
margin-top: -14em;
visibility: hidden;
}
</style>
<div id="zdes" class="hash">якорь-закладка №2</div>
<a href="#zdes">ссылка перенесёт на 14em над якорем-закладкой №2</a>
|
|---|---|
| Результат: | якорь-закладка №2 ссылка перенесёт на 14em над якорем-закладкой №2
|
Поисковые системы не рассматривают дубликатами друг друга веб-документы вида
http://shpargalkablog.ru/2010/09/postroenie-ssylok-v-html.html http://shpargalkablog.ru/2010/09/postroenie-ssylok-v-html.html#tut http://shpargalkablog.ru/2010/09/postroenie-ssylok-v-html.html#name
В HTML вебмастер может установить как открывать ссылку:
- в текущей вкладке или в текущем iframe. По умолчанию.
<a href="URL" target="_self">анкор</a>
| |
| Пример: | <a href="http://photos1.blogger.com/x/blogger2/6533/16720282190093/320/140728/plain.gif" target="_self">показать смайлик в этой вкладке или текущем iframe</a>
|
|---|---|
| Результат: | показать смайлик в этой вкладке или в текущем iframe |
| Описание: | Если на странице есть фрейм, который содержит другой фрейм, который содержит ссылку с кодом выше |
| Результат: | |
- в новой вкладке/окне. Пользователь в настройках браузера сам выбирает предпочитаемый вариант.
<a href="URL" target="_blank">анкор</a>
| |
| Пример: | <a href="http://photos1.blogger.com/x/blogger2/6533/16720282190093/320/140728/plain.gif" target="_blank">показать смайлик в новой вкладке/окне</a>
|
|---|---|
| Результат: | показать смайлик в новой вкладке/окне |
С помощью JavaScript можно, игнорируя желания пользователя, открыть ссылку в новом окне любого размера, но в таком окне нельзя будет поменять URL в адресной строке браузера.
- в текущей вкладке или в iframe.
<a href="URL" target="_parent">анкор</a>
| |
| Пример: | <a href="http://photos1.blogger.com/x/blogger2/6533/16720282190093/320/140728/plain.gif" target="_parent">показать смайлик в этой вкладке или во фрейме-родителе</a>
|
|---|---|
| Результат: | |
<a href="URL" target="_top">анкор</a>
| |
| Пример: | <a href="http://photos1.blogger.com/x/blogger2/6533/16720282190093/320/140728/plain.gif" target="_top">показать смайлик в этой вкладке</a>
|
|---|---|
| Результат: | |
<a href="URL" target="nameIframe">анкор</a>
| |
| Пример: | <a href="http://photos1.blogger.com/x/blogger2/6533/16720282190093/320/140728/plain.gif" target="raz">показать смайлик в iframe с указанным name</a>
<iframe name="raz" src=""></iframe>
|
|---|---|
| Результат: | показать смайлик в iframe с указанным name |
Отправить комментарий