Поява області при наводке курсора - Форум
Страница 1 из 11
Форум » Общий раздел » Урна » Поява області при наводке курсора
Поява області при наводке курсора

BaniK
VIP
Сообщений 43
+
+4141
-
Ваши награды 2
BaniK написал: В ответ пользователя BaniK Написано 07 мая 2012 в 22:37
Сообщение № 1
В мене э код кнопки скачування для каталого файлов, нада зробити так щоб коли наводеш на кнопку курсором під нею появлялась інформація(например розмір і число загрузок)
Вот сам код кнопки
В КСС
Code

.download_button1 {display:block; width:131px; height:38px; background:url('http://ukraine-in-cs.ucoz.ua/down.png') no-repeat; position:relative; color:#fff; text-shadow:0 1px 2px #000;}   
   .download_button1:hover {background-position:0 -38px; color:#fff;}   
   .error {   
   color: #990000;   
   background-color: #FFF0F0;   
   padding: 7px;   
   margin-top: 5px;   
   margin-bottom: 10px;   
   border: 1px dashed #990000;   
   }  


В то місце де б хотіли бачити
Code

<a class="download_button1" href="$FILE_URL$"> </a>
«Пред. тема След. тема»

Sid_MC_aka_Destroy
Пользователи
Сообщений 181
+
+67
-
Ваши награды 8
Sid_MC_aka_Destroy написал: В ответ пользователя Sid_MC_aka_Destroy Написано 08 мая 2012 в 00:02
Сообщение № 2
попробуй заменить

Code
<a class="download_button1" href="$FILE_URL$"> </a>


на

Code
<a onmouseover="$('.download_brief').show()" class="download_button1" href="$FILE_URL$"> </a>
<span onmouseout="$('.download_brief').hide()" class="download_brief">описание</span>
<style>
.download_brief {background-color: #85bc00; display: none; width: 131px; overflow: hidden; position: absolute; color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); border-radius: 3px; border: 1px solid #9eca00; z-index: 9999;}    
.download_brief:hover {background-color: #feaf00; color:#fff; border: 1px solid #fd9400}     
</style>


нужна подключённая jquery

Добавлено (08.05.2012, 00:02)
---------------------------------------------
ну или покрасивее)

Code
<a onmouseover="$('.download_brief').fadeIn()" class="download_button1" href="$FILE_URL$"> </a>  
  <span onmouseout="$('.download_brief').fadeOut()" class="download_brief">описание</span>  
  <style>  
  .download_brief {padding: 2px 3px; background-color: #85bc00; display: none; width: 120px; overflow: hidden; position: absolute; color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); border-radius: 3px; border: 1px solid #9eca00; z-index: 9999;}     
  .download_brief:hover {background-color: #feaf00; color:#fff; border: 1px solid #fd9400}      
  </style>
подпись:
Sid_MC_aka_Destroy

BaniK
VIP
Сообщений 43
+
+4141
-
Ваши награды 2
BaniK написал: В ответ пользователя BaniK Написано 08 мая 2012 в 00:08
Сообщение № 3
Спасибоювийшло круто up

Добавлено (08.05.2012, 00:08)
---------------------------------------------

Quote (Sid_MC_aka_Destroy)
ну или покрасивее)

Code
<a onmouseover="$('.download_brief').fadeIn()" class="download_button1" href="$FILE_URL$"> </a>  
  <span onmouseout="$('.download_brief').fadeOut()" class="download_brief">описание</span>  
  <style>  
  .download_brief {padding: 2px 3px; background-color: #85bc00; display: none; width: 120px; overflow: hidden; position: absolute; color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); border-radius: 3px; border: 1px solid #9eca00; z-index: 9999;}     
  .download_brief:hover {background-color: #feaf00; color:#fff; border: 1px solid #fd9400}      
  </style>

Да це красивіше)))
Але мож зробити так щоб "описание" пропадало нетільки коли на нього наводеш мишкой но і коли просто забираеш курсор з кнопки?

Sid_MC_aka_Destroy
Пользователи
Сообщений 181
+
+67
-
Ваши награды 8
Sid_MC_aka_Destroy написал: В ответ пользователя Sid_MC_aka_Destroy Написано 08 мая 2012 в 00:24
Сообщение № 4
Code
<div onmouseout="$('.download_brief').fadeIn()} else {$('.download_brief').fadeOut()" style="overflow: hidden;">
<a onmouseover="$('.download_brief').fadeIn()" class="download_button1" href="$FILE_URL$"> </a>   
   <span onmouseout="$('.download_brief').fadeOut()" class="download_brief">описание</span>   
</div>  
   <style>   
   .download_brief {padding: 2px 3px; background-color: #85bc00; display: none; width: 120px; overflow: hidden; position: absolute; color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); border-radius: 3px; border: 1px solid #9eca00; z-index: 9999;}      
   .download_brief:hover {background-color: #feaf00; color:#fff; border: 1px solid #fd9400}       
   </style>

Добавлено (08.05.2012, 00:24)
---------------------------------------------
то есть

Code
<div onmouseout="$('.download_brief').fadeOut()" style="overflow: hidden;">  
  <a onmouseover="$('.download_brief').fadeIn()" class="download_button1" href="$FILE_URL$"> </a>    
    <span onmouseout="$('.download_brief').fadeOut()" class="download_brief">описание</span>    
  </div>   
    <style>    
    .download_brief {padding: 2px 3px; background-color: #85bc00; display: none; width: 120px; overflow: hidden; position: absolute; color: #fff; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5); border-radius: 3px; border: 1px solid #9eca00; z-index: 9999;}       
    .download_brief:hover {background-color: #feaf00; color:#fff; border: 1px solid #fd9400}        
    </style>
подпись:
Sid_MC_aka_Destroy

BaniK
VIP
Сообщений 43
+
+4141
-
Ваши награды 2
BaniK написал: В ответ пользователя BaniK Написано 08 мая 2012 в 00:33
Сообщение № 5
Спасибо smile ,тему можно закривати

Sid_MC_aka_Destroy
Пользователи
Сообщений 181
+
+67
-
Ваши награды 8
Sid_MC_aka_Destroy написал: В ответ пользователя Sid_MC_aka_Destroy Написано 08 мая 2012 в 00:34
Сообщение № 6
BaniK, пожалуйста)
обращайся wink
подпись:
Sid_MC_aka_Destroy

BlackPh
Пользователи
Сообщений 1396
+
+538
-
Ваши награды 28
BlackPh написал: В ответ пользователя BlackPh Написано 08 мая 2012 в 01:10
Сообщение № 7
BaniK, якщо пишеш на українській мові то пиши правильно с(:
подпись: Мой Vkontakte : vkontakte.ru/blackphxd
Мой Skype: SykybaXD BlackPh
Форум » Общий раздел » Урна » Поява області при наводке курсора
Страница 1 из 11
Поиск:
Топ пользователей: