-
Вебмастеру
(
http://forum.oszone.net/forumdisplay.php?f=22)
Карина |
09-10-2008 16:51 919753 |
Меняющаяся кнопка
как запихнуть свою кнопку для сайта в программу Fronte Page? Вернее рисунок для меняющейся кнопки? Читала справку - но у себя таких опций не нашла((
Сеньку!!!!
|
Coutty |
09-10-2008 17:24 919788 |
Оооо... Да кто его знает, этот FrontPage?)
Зайдите в папку, куда сохранён сайт и подмените изображение кнопки.
|
Карина |
09-10-2008 17:31 919796 |
пыталась, но не могу найти папку
|
D_Master |
09-10-2008 19:26 919887 |
Карина, ЕМНИП, то Мои документы\Мои веб-сайты (Мои веб/web-страницы?)
Цитата:
Цитата Карина
рисунок для меняющейся кнопки »
|
что вы имеете ввиду? Типа, рисунок 1, наводишь мышку - рисунок меняется на рис.2, отводишь мышку - обратно меняется на 1й? Если да, то делаем так:
Код:
<img src="1.jpg" onmouseover="this.src='2.jpg';" onmouseout="this.src='1.jpg';" />
|
Карина |
10-10-2008 18:38 920757 |
D_Master, сейчас попробую объяснить наглядно в рисунках. Кнопку со второго рисунка запихнуть в обзор кнопок. Это просто фон для кнопок. Вот мой сайт http://sfinxcats.narod.ru/ (он очень банальный, я новичок) По левой стороне расположены ссылки , я хочу сделать фон у надписей. У дизайнера на сайте были эти кнопки в бесплатной раздаче, значит они как то используются? Или надпись надо делать в фотошопе...? У меня в спрвке программы есть инструкции, но в программе нет таких опций.
|
D_Master |
10-10-2008 20:54 920819 |
Карина, если вы хотите сделать кнопки с надписями на фоне (рис.2.jpg), то можно сделать :wink:
|
Coutty |
11-10-2008 09:21 921082 |
Размещайте их на слоях. Например, так:
HTML код:
<img src='background.jpg' style='position:absolute; top:100; left:100; z-index:1' /><div style='position:absolute; top:100; left:100; z-index:2'>Текст поверх картинки</div>
|
Карина |
11-10-2008 18:23 921303 |
D_Master, Я не умею. Я не дружу с фотошопом.
Coutty, я такой диллетант, что я изнасиловала уже этот код и ничего не добилась. ) Что с ним надо делать?
|
Coutty |
12-10-2008 09:43 921633 |
Карина, сохраните это в html-файле:
HTML код:
<html>
<head>
<title>Заголовок</title>
<style>
div#nav a {
font-weight:bold;
font-size:40;
text-align:center;
background-image:url('1.jpg');
width:200;
height:50;
display:block;
text-decoration:none;
color:black
}
div#nav a:hover {
background-image:url('2.jpg');
color:white;
}
</style>
</head>
<body>
<div id='nav' style="top:100; left:100">
<a href='link1.html'>Ссылка 1</a>
<a href='link2.html'>Ссылка 2</a>
<a href='link3.html'>Ссылка 3</a>
<a href='link4.html'>Ссылка 4</a>
<a href='link5.html'>Ссылка 5</a>
<a href='link6.html'>Ссылка 6</a>
</div>
</body>
</html>
1.jpg и 2.jpg - картинки размером 200х50 в той же папке, что и html-файл.
Работает даже в Internet Explorer 6 :)
(Да, я немного изменил то, что предложил изначально. Потому что это более простой вариант)
|
Карина |
14-10-2008 16:39 923708 |
|
Coutty |
14-10-2008 17:38 923758 |
Вложений: 2
Такой вариант:
HTML код:
<html>
<head>
<title>Заголовок</title>
<style>
a {
font-weight:bold;
font-size:20;
text-decoration:none;
color:white;
}
div.na {
position:absolute;.
left:10;
width:269;
height:53;
text-align:center;
background-image:url('1.gif');
}
div:hover.na {
background-image:url('2.gif');
}
</style>
</head>
<body>
<div class='na' style='top:0' onmouseover='this.style.backgroundImage="url(\"2.gif\")"' onmouseout='this.style.backgroundImage="url(\"1.gif\")"'><a href='link1.html'>О породе</a></div>
<div class='na' style='top:35' onmouseover='this.style.backgroundImage="url(\"2.gif\")"' onmouseout='this.style.backgroundImage="url(\"1.gif\")"'><a href='link2.html'>Ананас</a></div>
<div class='na' style='top:70' onmouseover='this.style.backgroundImage="url(\"2.gif\")"' onmouseout='this.style.backgroundImage="url(\"1.gif\")"'><a href='link3.html'>В добрые руки</a></div>
<div class='na' style='top:105' onmouseover='this.style.backgroundImage="url(\"2.gif\")"' onmouseout='this.style.backgroundImage="url(\"1.gif\")"'><a href='link4.html'>Horror</a></div>
<div class='na' style='top:140' onmouseover='this.style.backgroundImage="url(\"2.gif\")"' onmouseout='this.style.backgroundImage="url(\"1.gif\")"'><a href='link5.html'>Гостевая</a></div>
</body>
</html>
Если хотите шрифт дугой, то только на картинках рисовать.
А кошки мне не понравились :tomato2:
|
Карина |
14-10-2008 18:31 923809 |
Coutty, спасибо!!!!! В фотошопе я тоже дугой не умею) Ладно , попрошу кого-нибудь.
А не понравились именно наши кошки или кошки этой породы?
|
Coutty |
14-10-2008 20:17 923901 |
Вложений: 1
Прикрепляю "демку" для фотошопа. Достаточно просто изменить текст (возможно - цвет, шрифт, размер, эффекты наложения).
Мне в принципе лысые кошки и собаки не нравятся. Но я понимаю, что кому-то они по душе, т.ч. никаких претензий :)
|
D_Master |
14-10-2008 21:03 923945 |
Карина, отблагодарить можно и нажатием на кнопку "Полезное сообщение" :wink:
|
Карина |
14-10-2008 21:49 924018 |
Coutty, я сгорю сейчас со стыда :blush2:
Пойду поищу учебники по фотошопу. Не получается сделать дугой
Coutty, все, поняла. я просто сохранила в jpeg а в psd получается!
|
Карина |
14-10-2008 21:58 924030 |
Coutty, Как закрасить фон Белый? Чтобы одна скобка осталась, один рисунок!
|
Coutty |
14-10-2008 22:12 924042 |
В jpg нельзя избавиться от фона. Если хотите прозрачный фон, сохраняйте или в gif или в png. Впрочем, IE6 не понимает png с прозрачностью, поэтому лучше использовать gif (в фотошопе файл-> сохранить для web).
|
Карина |
14-10-2008 22:25 924059 |
Coutty, теперь белая грязь по краям торчит.
|
Coutty |
14-10-2008 22:34 924075 |
Изображение -> Режим -> Индексированные цвета.
После этого попиксельно стирается всё ненужное. Если стирать в режиме RGB, то получаются полупрозрачные области, которые при сохранении заменяются на определённый цвет (у вас белый, но можно поменять на чёрный из панельки сохранения для web).
|
Карина |
14-10-2008 22:39 924079 |
У меня не активна "Сохранение для web" Неактивна опция.
|
Coutty |
15-10-2008 08:34 924296 |
Как это неактивна? Должна быть активна, если изображение открыто.
Ну просто в gif сохраняйте через "Сохранить как". Только края предварительно от белых пикселов очистить надо.
|
Время: 20:42.
© OSzone.net 2001-