Jump to content
  • 0

Сделать часть картинки ссылкой


leny1984
 Share

Question

Доброго времени суток, уважаемые форумчане и программисты!

У меня такая проблема, на сайте есть хедер, в фотошопе дополнил его красивым заголовком, теперь нужно это изменение сделать ссылкой. То есть чтобы отдельная часть картинки была ссылкой.

В исходном коде страницы картинка выводится вот так:

<div id="block-header"><div>

А вот css:

#block-header { background: url(../../images/header/rust/header_destroyed2.png) 50% 0 no-repeat; position: relative; z-index: 999; }

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

Заранее очень благодарен!

Link to comment
Share on other sites

3 answers to this question

Recommended Posts

  • 0

Проще всего вставить внутрь этого блока обычную ссылку, сделать ей display: block с размерами нужной области и спозиционировать абсолютно в нужное место. А чтобы текст ссылки не мешал, можно, например, сделать ее полностью прозрачной (opacity: 0 + фильтр для старых IE).

Можно поучиться у Стью Николлза, он некогда не одну @-у съел на таких эффектах :)

Link to comment
Share on other sites

  • 0

Проще всего вставить внутрь этого блока обычную ссылку, сделать ей display: block с размерами нужной области и спозиционировать абсолютно в нужное место. А чтобы текст ссылки не мешал, можно, например, сделать ее полностью прозрачной (opacity: 0 + фильтр для старых IE).

Можно поучиться у Стью Николлза, он некогда не одну @-у съел на таких эффектах :)

Спасибо, а можно пример?

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy