Николай И.
106 сообщений
#14 лет назад


Излагаю суть проблемы:
Есть Изображение и Флеш анимация. Все это воедино должно составлять шапку "резинового" сайта. Слепить их вместе было бы удобно, если бы сайт был не резиновый, но заказчик хочет резинку... Есть мысль сделать однотонное "продолжение" изображения, каждый сегмент продолжения шириной 1px. Надо сделать методами html. Сделать чтобы число этих сегментов подстраивалось под ширину экрана юзера. Мои всяческие попытки никак не увенчались успехом. Может кто нибудь доходчиво объяснить и даст совет? Жалко из-за такого косяка терять весь заказ, когда вся работа почти выполнена.

Вот что я пытался сделать и прикрепил изображение, что получилось. В конечном итоге должно все выглядеть как единое целое...
<center><div class="abc"><img src="/images/head1.png" />
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="689" height="250" id="/flash.swf" align="middle">
<param name="movie" value="/flash.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!-->-->
<object type="application/x-shockwave-flash" data="/flash.swf" width="689" height="250">
<param name="movie" value="/flash.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--<!-->
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Загрузить Adobe Flash Player" />
</a>
<!-->-->
</object>
<!--<!-->
</object></div></center>
Александр Отсутствую
3460 сообщений
#14 лет назад
Ничччё не понял
Выложите скрин макета.
Александр Отсутствую
3460 сообщений
#14 лет назад


Может так Вам нужно, чтоб тянулось (сомневаюсь - это просто, но я вижу только такой вариант)?
Николай И.
106 сообщений
#14 лет назад
MrWolf, Да, именно так. И чтобы изображение и флеш ровно состыковывались по высоте. Наверное в моем коде много лишнего, поэтому флеш так опустился вниз... Но надо чтобы флеш отображался во всех браузерах, а то он капризный
Александр Отсутствую
3460 сообщений
#14 лет назад
ЧЕРД!! ) Случайно заменил сообщение. В общем краткий реплей..
Не вижу проблемы. Я б сделал так (и так правильно!!!)
Делаете блок с градиентом (1 пиксельная вертикальная линия, которая дублируется по оси X). В этом блоке делаете еще два:
1) лого с флоат лефтом
2) блок с флоат райтом, в котором находится флешка.

Все) Проще простого! ))

EXP_Service, лишние отступы могут появляться от того, что не обнулены теги типа object и т .д. (не знаю как object, но, к примеру input имеют отступы по-умолчанию, как и многие другие.. тем более, в разных браузерах по-разному).. поэтому нужно обнулять {margin:0;padding:0;}
Владимир З.
366 сообщений
#14 лет назад
<center> — это из какого века?
Александр Отсутствую
3460 сообщений
#14 лет назад
Цитата ("EXP_Service"):
1px вертикальная дублирующаяся линия не получается

Потому что Вы меня не слушали совсем)) Влюбились, что ли?

Цитата ("EXP_Service"):
<div class="head_img"><img src="{THEME}/images/head1.png" alt="Получить онлайн консультацию" /></div>

Ваша верстка начинается с блока с логотипом.. я говорил совсем не так )) Начинаете с блока на всю ширину, в котором прописываете фон - дублирующаяся по оси X верстикальная линия градиента. А в нем уже блок с логотипом и флешкой! Ведь проще быть не может! )) Я так полагаю, что остальную верстку не Вы делаете, потому что то, что мы сейчас обсуждаем - элементарно.

Цитата ("EXP_Service"):
background: url("../images/1px.png");
        background-repeat: repeat-x;

Пользуйте краткой записью
background: url("../images/1px.png") repeat-x;


EXP_Service, один div у Вас не закрыт, насколько я вижу
Николай И.
106 сообщений
#14 лет назад
MrWolf, Я веб дизайнер и чуть чуть веб программист. Считаю, что надо развиваться, поэтому взял целый заказ на сайт, а не просто сделать макет. Вы правы, часть структуры сайта делал не я.
Александр Отсутствую
3460 сообщений
#14 лет назад
EXP_Service, я понимаю, но просто не выход верстку каждого блока обсуждать на форуме. Нужно просто потренироваться на любом из макетов.. парочку сверстаетет и уже таких вопросв не будет возникать ))

.. или можно заказать верстку у меня
Николай И.
106 сообщений
#14 лет назад


Начинает бесить уже ))
	<style type="text/css">
.1px {
background: url("../images/1px.png") repeat-x;
}
.1px.head_img {
float: left;
margin:0px;
padding:0px;
}
.1px.head_flash {
float: right;
margin:0px;
padding:0px;
}
</style><div class="1px">
<ul class="head_img"><img src="/images/head1.png" border="0" /></ul>
<ul class="head_flash"><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" width="689" height="250" id="/flash.swf" align="middle">
<param name="movie" value="/flash.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!-->-->
<object type="application/x-shockwave-flash" data="/flash.swf" width="689" height="250">
<param name="movie" value="/flash.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#ffffff" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />
<!--<!-->
<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Загрузить Adobe Flash Player" />
</a>
<!-->-->
</object>
<!--<!-->
</object></ul></div>
Александр Отсутствую
3460 сообщений
#14 лет назад
EXP_Service, ul? Как так получилось, что там появились ul, вместо div? O_0 фантастика)))

Цитата ("EXP_Service"):
А мне всего то лишь нужно доделать это, чтобы сдать проект...

Варианты:
1) вернуться в прошлое и подучить html
2) сейчас подучить html
3) попросить кого-то сверстать за денежку.. пару баков и через две минуты будет результат Ведь Вы не за бесплатно делаете.. вот поэтому Вам готового варианта просто так, принципиально, никто не даст, несмотря на то, что я более чем подробно объяснил
Николай И.
106 сообщений
#14 лет назад
MrWolf, Спасибо большое за помощь! Профессионально работаете!
Елена Б.
6863 сообщения
#14 лет назад
Епт. ну и тема... а парень, наверное, денег берет больше, чем я за двиг с нуля... Пошла пить успокоительное, объясните ему те, у кого нервы в порядке, пожалуйста!
Виталий Я.
659 сообщений
#14 лет назад
Цитата ("EXP_Service"):
градиентные изображения шириной 1 пиксель
Долго думал, как можно сделать градиент шириной в 1 пиксель )
Евгений Шевченко
23 сообщения
#14 лет назад
Даю правильный ответ. Слушай внимательно т.к. в следующий раз зайду на форум через неделю.
Берешь лого и флеш-баннер в один div и вешаешь на него градиент.

background-image: -o-linear-gradient(rgb(255,255,255),rgb(223,223,223));
background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#dfdfdf));
background: -moz-linear-gradient(top, #ffffff, #dfdfdf);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#dfdfdf');

Никаких однопиксельных картинок. Тупо css3 + хак для осла.
З.Ы. Цвета поправь. У меня в примере серенький.
Николай И.
106 сообщений
#14 лет назад
cmd, Из серии "Учитесь, пока я жив" Спасибо, даже не знал что так можно
Xazzzi, И? Узнали как?
floppox, Не считайте чужие деньги. Вам никто не мешает брать хоть миллион. Может вы объясните мне смысл в самописаном вашем движке? Я купил полную лицензию для DLE и подстраиваю его под свои нужды. Меня полностью устраивает легкость продвижения в поисковиках и дыр в cms почти нет. Если что то нужно для DLE, все доп. модули есть в интернете, просто все переделываете под себя и всё.

Вчера за ночь я заново перечитал чуть ли не весь учебник по CSS и HTML
Виталий Я.
659 сообщений
#14 лет назад
EXP_Service, ну, длительный мыслительный процес окончился выводом, что впринцыпе с шириной в 1 пиксель все же можно сделать вертикальный градиент, если конечно в высоту картинка не несолько пикселей
Александр Отсутствую
3460 сообщений
#14 лет назад
Цитата ("cmd"):
Даю правильный ответ.

Цитата ("cmd"):
Тупо css3 + хак для осла.

Ответ неправильный по многим причинам.. от неподдержки некоторыми браузерами CSS3 (пришлось хак дописывать) до того, что градиент может быть не просто с цвета в цвет, а сложный или со смещенным центром или еще что-то. Ведь проще и правильнее продублировать 1px изображение, которое весит считанные байты, чем потом копаться в таких вот записях, как у Вас (это только один градиент прописан, а если все в таком стиле делать, то с ума можно сойти, когда кто-то будет разбираться после вас)!!!
Артём К.
1157 сообщений
#14 лет назад
Цитата ("cmd"):
Никаких однопиксельных картинок. Тупо css3 + хак для осла.


Пример конечно рабочий, но совсем не факт, что градиент сделанный через css совпадёт с тем градиентом, который делал дизайнер.
Потому картинкой делать надёжнее.