Friend's World - Мир Друзей

Friend's World - Мир Друзей (http://friendsworld.ru/index.php)
-   Вебпрограммирование (http://friendsworld.ru/forumdisplay.php?f=41)
-   -   Градиент во всю главную страницу сайта (http://friendsworld.ru/showthread.php?t=27762)

romulus 06.12.2008 12:58

Градиент во всю главную страницу сайта
 
Кто может реально-практически проконсультировать, как сделать градиент для главной страницы сайта, причем --- на всю страницу и нужно максимально высокое качество?

1/ Программно (лучше? Но как? или надежнее будет ---> )
2/ Картинка градиента в бэкграунде на конкретное разрешение страницы, какой тогда размер полотна взять?

Долго бьюсь над этой проблемой, программно делал сложный градиент, было ок на десктопе, но он отображался в виде ступенек при просмотре на удаленном компе при публикации на сайте. Пришлось убрать.

Citrovod 08.12.2008 10:21

Ответ: Градиент во всю главную страницу сайта
 
единственный вариант в фотошопе сделать - но большой - что весить будет много... програмно - не у всех показывать будет!

Длон 08.12.2008 10:39

Ответ: Градиент во всю главную страницу сайта
 
romulus, не советую. Это будет грузить реально сайт

romulus 08.12.2008 14:48

Re: Градиент во всю главную страницу сайта
 
По коду видно, что используется растягивание (узкой вертикальной) картинки.

В оффлайне этот код и на Опере и Файерфоксе был просматриваем ок. В онлайн - это другое дело?

<body bgcolor=navy background="gradient061208.files/image001.jpg" lang=RU
style='tab-interval:35.4pt'>
<!--[if gte vml 1]><v:background id="_x0000_s1025" o:bwmode="white"
fillcolor="navy" o:targetscreensize="1280,1024">
<v:fill color2="black" focus="-50%" type="gradient"/>
</v:background><![endif]-->

Дайте плииз какие-нить советы по модернизации кода. Мне непонятно, почему там еще русский язык упомянут. Это еще зачем? - Может тут надо выбросить половину кода ;-) из того, что мне Word написал при сохранении в html.

Я бы попробовал (из-за ступенек горизонтальных) и в графике сделать, это просто в любом графредакторе, тем более, что страница первая index ведь все равно статическая, там только кнопки. Но не знаю, как выбрать размер холста на рабочее разрешение 1280 х 1024. Как тут надо рассуждать? Ну и формат... gif / jpg?

Длон 08.12.2008 19:54

Ответ: Re: Градиент во всю главную страницу сайта
 
romulus, делай это все в Adobe Dreamweaver, а не в Word_е
И укажи разрешение не 1280 х 1024, а 100%
формат jpg

Citrovod 09.12.2008 15:40

Ответ: Градиент во всю главную страницу сайта
 
Ворд - это для текстов, а не для страниц!:gy:

romulus 09.12.2008 16:13

Re: Градиент во всю главную страницу сайта
 
ВОПРОС: dreamweaver дура большая. есть ли в ней градиент точно?

Eсли Word сохраняет в html , то разве есть разница?

Длон 09.12.2008 20:01

Ответ: Re: Градиент во всю главную страницу сайта
 
Цитата:

Сообщение от romulus (Сообщение 246596)
ВОПРОС: dreamweaver дура большая. есть ли в ней градиент точно?

Что значить есть ли в ней?
Указываешь путь до картинки градиента своего. И наглядно увидишь

Цитата:

Сообщение от romulus (Сообщение 246596)
Eсли Word сохраняет в html , то разве есть разница?

Блокнот тоже сохраняет в html

Совет - почитай соответствующею литературу по html. В инете полно

Citrovod 10.12.2008 19:55

Ответ: Градиент во всю главную страницу сайта
 
хотя многие и так работают в блокноте.... твой выбор!:hat:

KotlinDm 28.12.2010 02:09

Re: Градиент во всю главную страницу сайта
 
Эээ я может просто вопроса не понял, но я не вижу особой проблемы тут. Я делаю в фотошопе вертикальный градиент от цвета «А» до цвета «В». Делаю кроп до 1 пикселя в ширину, а высота остаётся неизменной. Получаю картинку весом не больше 100 байт (размер делаю примерно 700х1 пикселей). Вот, потом присваиваю странице эту картинку как фоновое изображение с горизонтальным повторением, а цвет фона делаю такой же как цвет «В» (если не в курсе, то это можно сделать пипеточкой в Фотошопе в файле с градиентом).
Ну для наглядности часть CSS кода:
body {
background-image: url(вышеупомянутаякартиночка.jpg);
background-repeat: repeat-x;} -повторение по горизонтали

:blush: по голове не бить если я что то не так понял.

Единственный минус, что эффекта радиального градиента так не добиться. Но зато кроссбраузерно и весит не много.

Длон 28.12.2010 04:15

Re: Градиент во всю главную страницу сайта
 
KotlinDm, да все правильно, но только человек использовал ворлд и не использовал на сайте CSS.
Хоть и CSS известен давно, но применять его стали для сайтов можно сказать недавно.
Я не говорю уже о таких движках как DataLife Engine, который за последние 2 года столько версий обновлял, что я лично задолбался обновлять сайты)).
Ну а в 2008 году мало кто использовал да и не знал как, да и очень большая проблема была с браузерами.
Особено с Оперой, Мозилой и Экспловером 6

fuente 07.07.2011 14:02

Re: Градиент во всю главную страницу сайта
 
Градиентную полосу в пару пикселей и в CSS свойство repeat-x, например...

wstern 17.03.2012 15:56

Re: Градиент во всю главную страницу сайта
 
использую css3 градиенты (гуглите), на любителей старых браузеров кладу болт, ну или пусть загружают большие картинки

Ngorco 27.04.2012 15:44

Re: Градиент во всю главную страницу сайта
 
CSS3 конечно хорошо, но лучше все же использовать стандартные способы. Сделай файл градиента размером 300х300. Больше не надою и пихай код в стиль боди(ну или куда тебе надо):
body{
background: url(http://adamdorman.com/_images/gradient.jpg) no-repeat;
background-size: 100% 100%;
}

пока что рабочий пример ;)

romulus 26.03.2013 12:46

Re: Градиент во всю главную страницу сайта
 
Столько лет прошло уже, мы состарились весьма, а тема мне всё интересна. Читаю самозабвенно ваши комменты и советы. Счас и Андроид к теме подтянулся на планшетах. Продолжайте плиз!


Часовой пояс GMT +4, время: 18:41.

Работает на vBulletin® версия 3.8.5.
Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.
Перевод: zCarot
Kопирование разрешено при размещении активной ссылки на источник: http://www.friendsworld.ru