Всплывающее окошко с кусочком текста.

На сайте http://aklion.ru/ внизу стоит мигающий значёк копирайта, нужно к нему привинтить простейшее всплывающее окно с текстом типа "Ай яй яй тырить фото нехорошо" Желательно иметь возможность форматирования текста. И желательно в рамочку его оформить. Как бы это сделать по совсем простому?

Коментарии: 5

Kama

27.04.2010 22:42

Ответить

откройте ваш файл стилей style.css найдите там стиль

.copyright{ 
    float: left;
    float: top;
    margin-left: 936px;
    margin-top: -22px;
}

и замените его на это:

.copyright{ 
    position:relative;
    float: left;
    float: top;
    margin-left: 936px;
    margin-top: -22px;
}
.copy_protect {display:none; background:#3D3D3D; color:#eee; border:2px solid #8B8B8B; white-space:nowrap; padding:1px 5px;
-moz-border-radius: 4px;
-webkit-border-top-left-radius: 5px; 
-webkit-border-top-right-radius: 5px; 
-webkit-border-bottom-right-radius: 5px; 
-webkit-border-bottom-left-radius: 5px; 
-khtml-border-top-right-radius: 5px;
border-radius: 5px;
}

Затем откройте файл где картинка копирайта расположена: footer.php

Там найдите:

<div class="copyright">
<img src='http://aklion.ru/wp-content/themes/aklion/images/copyright.gif'>
</div>

И замените на:

<div class="copyright">
<img src='http://aklion.ru/wp-content/themes/aklion/images/copyright.gif' />
<div class='copy_protect'>Ай яй яй тырить фото нехорошо</div>
</div>

В Футере соответственно можете изменять текст.
Я еще стиль под ваш дизайн самолетом подогнал 🙂

AKlion

27.04.2010 23:40

Ответить

Сделал всё как ты описал, у меня не сработало. Вродебы всё сдела правильно.

-HIMk

28.04.2010 06:32

Ответить

может IE ? xD

Kama

28.04.2010 13:08

Ответить

Сделал всё как ты описал, у меня не сработало. Вродебы всё сдела правильно.

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

Вот, теперь рабочий код (поправил).
откройте ваш style.css замените:

.copyright{
position:relative;
float: left;
float: top;
margin-left: 936px;
margin-top: -22px;
}
.copy_protect {display:none; background:#111; color:#eee; border:1px solid #524232; white-space:nowrap; padding:4px 8px;
margin-left: -500px;
font-weight:bold;
text-align: right;
}

На

.copyright {
position:relative; cursor:help;
float: left;
float: top;
margin-left: 936px;
margin-top: -22px;
}
.copy_protect {position:absolute; top:100%; right:0px; display:none; background:#3D3D3D; color:#eee; border:2px solid #8B8B8B; white-space:nowrap; padding:1px 5px;
-moz-border-radius: 4px;
-webkit-border-top-left-radius: 5px;
-webkit-border-top-right-radius: 5px;
-webkit-border-bottom-right-radius: 5px;
-webkit-border-bottom-left-radius: 5px;
-khtml-border-top-right-radius: 5px;
border-radius: 5px;
}
.copyright:hover .copy_protect {
display:block;
}

footer.php редактировать не нужно уже. Я смотрю вы туда уже добавили текст, там щас все правильно!

AKlion

28.04.2010 13:18

Ответить

Преогромнейшее спасибо за помощь!!!

Всплывающее окошко с кусочком текста.

Свежее