Как добавить кнопку поверх баннера?

[Alexander Koshelkov 1]

Доброго времени суток. Мне необходимо добавить кнопку на главный баннер в моём стиле. Не подскажете как это сделать?

Вот как она должна выглядеть (кнопку я нарисую и залью на хостинг, интересует какой нужно добавить код):

Вот код хеадера-

 

}

#feature_head {

background:url({style_images_url}/cs_header.jpg) no-repeat scroll 0 50% #152E46;

height:260px;

margin: 25px -10px 0px -10px;

position:relative;

}

#feature_logo {

margin-left:20px;

margin-top:20px;

position:absolute;

}

#secondary_nvs {

background-position:center top;

clear:both;

font-size:0.9em;

padding: 21px 0;

}

#secondary_nvs li {

float:left;

padding-right:7px;

}

 

Вроде бы он :) . Как он выглядет сейчас можно посмотреть тут

[Fisana 700]

Код не нужен.

Перед

 

Добавьте

<div style='z-index:11000; position: absolute; top: 100px; left: 50px;'><img src='{$this->settings['img_url']}/knopka.png' alt='' /></div>

Точные координаты вычислите сами.

 

Ну и чтобы кнопка работала, к картинке надо какое-то действие прикрепить.

[Alexander Koshelkov 1]

Код не нужен.

Перед <div id='primary_nav'>

 

Добавьте

<div style='z-index:11000; position: absolute; top: 100px; left: 50px;'><img src='{$this->settings['img_url']}/knopka.png' alt='' /></div>

Точные координаты вычислите сами.

 

Ну и чтобы кнопка работала, к картинке надо какое-то действие прикрепить.

Спасибо, добавел настроил положение, как настроить адрес (куда она видет) какой код и куда добавить. Я очень извеняюсь, я ещё зелёный в этом деле :). Тыкую, пробую, учусь

[Fisana 700]

<img src='{$this->settings['img_url']}/knopka.png' alt='' />

заменить на

<a href='http://адрес куда ведет/'><img src='{$this->settings['img_url']}/knopka.png' alt='' /></a>

[Alexander Koshelkov 1]

<img src='{$this->settings['img_url']}/knopka.png' alt='' />

заменить на

<a href='http://адрес куда ведет/'><img src='{$this->settings['img_url']}/knopka.png' alt='' /></a>

Супер. Сделал, вот ещё одна проблема. Я настроил кнопку под своё разрешение - 1920х1080 она стоит там где надо. Но вот на моём другом монеторе с другим разрешением она уезжает в другое место. Как её закрепить?

 

1920х1080

1600x900

 

п.с. исчерпал лимит на загрузку

[Fisana 700]

Попробуйте использовать

position: relative;

вместо absolute

 

 

Ps

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

Иначе никакого дискового пространства не хватит.

[Alexander Koshelkov 1]

Вот с этим кодом

<div style='z-index:11000; position: relative; top: 0px; left: 10px;'><a href='http://www.creativestation.ru/index.php?showtopic=8939/'><img src='{$this->settings['img_url']}/knopka.png' alt='' /></a></div>

<div id='primary_nav'>

 

выглядет так

 

Можно сделать что бы просто нажатием на банер перекидовало в тему, не добавляя кнопку(на задний баннер тот что с облоками, под лого и навигацией)?

 

Т.к. этот баннер будет постоянно меняться. На нем будут рекламироваться конкурсы и при нажатии на него он должен кидать в тему с конкурсом

 

Вот например другой баннер (не доделанный):

Изменено 6 мая 2011 пользователем Alexander Koshelkov

[Fisana 700]

Можно привязать ссылку для перекидывания к сменному логотипу (баннеру). Меняется же только картинка, но не ссылка.

Но лучше не нужно, потому что и поисковики, и пользователи привыкли, что нажатие на лого выводит на главную страницу форума.

Хотя точно сказать, нанесет ли это вред, не могу.

[Alexander Koshelkov 1]

Логотип у меня отдельно, он сейчас кликабельный. А баннер нет. Надо сделать баннер тоже кликабельным. Лого будет вести на главную, а баннер в тему

[Fisana 700]

В html картинка баннера прописана или в css?

Если в html, все просто, засовываете в ссылку как кнопку

<a href='http://адрес куда ведет/'><img src='{$this->settings['img_url']}/баннер.png' alt='' /></a>

А если в css, придется делать прозрачную картинку, размером с баннер, и привязывать как кнопку поверх баннера.

[Alexander Koshelkov 1]

В html картинка баннера прописана или в css?

Если в html, все просто, засовываете <img src .... /> в ссылку как кнопку

<a href='http://адрес куда ведет/'><img src='{$this->settings['img_url']}/баннер.png' alt='' /></a>

А если в css, придется делать прозрачную картинку, размером с баннер, и привязывать как кнопку поверх баннера.

В CSS

 

}

#feature_head {

background:url({style_images_url}/cs_header.jpg) no-repeat scroll 0 50% #152E46;

height:260px;

margin: 25px -10px 0px -10px;

position:relative;

}

[Fisana 700]

В таком случае делайте прозрачный png вместо кнопки (только больше, желательно размером с баннер) и привязывайте в html поверх баннера.

Код писала выше.

 

В принципе можно и 1 на 1 px сделать

Но тогда растянуть, задав размеры/ Примерно так

<a href='http://адрес куда ведет/'><img src='{$this->settings['img_url']}/knopka.png' width='300' height='160' alt='' /></a>

[Alexander Koshelkov 1]

:blink: Может мне можно вас к себе пригласить, в АДЦ ? А то уже теоремы не совсем понятны получаются ))