Николай И.
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 совпадёт с тем градиентом, который делал дизайнер.
Потому картинкой делать надёжнее.