VPF::[JQuery]Обнесение бордером элемента

programming

Дата 30.8.2010, 10:28 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 227
Регистрация: 20.6.2008

Репутация: нет
Всего: 1

Есть страница. Нужно написать такой JS на JQuery, чтобы при поднесении на любой элемент страницы, он обносился бордером.
В общем как-то так

Код


$("*").mouseover(function(){
    $(this).css("border","3px solid blue");
  });

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

В пример, как в плагине фаербаг у фаерфокса или драгонфлай у оперы.

--------------------

<удалено администрацией>

CruorVult

Дата 30.8.2010, 11:16 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 868
Регистрация: 24.9.2008
Где: г.Киев, Украина

Репутация: 1
Всего: 28

Код


$("body *").mouseover(function(e){        
    e.target.className = "border";
});
$("body *").mouseout(function(e){
    e.target.className = "";    
});

programming

Дата 30.8.2010, 12:53 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 227
Регистрация: 20.6.2008

Репутация: нет
Всего: 1

Цитата(CruorVult @ 30.8.2010, 09:16)

Код


$("body *").mouseover(function(e){        
    e.target.className = "border";
});
$("body *").mouseout(function(e){
    e.target.className = "";    
});

Я туплю или оно не работает?
Можно более расширенный пример?(со страницей)

Спасибо.

--------------------

<удалено администрацией>

CruorVult

Дата 30.8.2010, 12:57 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 868
Регистрация: 24.9.2008
Где: г.Киев, Украина

Репутация: 1
Всего: 28

Код


<style>
.border {
border:3px solid blue;
}
</style>

не забыли?

programming

Дата 30.8.2010, 12:58 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 227
Регистрация: 20.6.2008

Репутация: нет
Всего: 1

Не забыли.

--------------------

<удалено администрацией>

CruorVult

Дата 30.8.2010, 12:59 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 868
Регистрация: 24.9.2008
Где: г.Киев, Украина

Репутация: 1
Всего: 28

тег <body> присутствует?

programming

Дата 30.8.2010, 13:02 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 227
Регистрация: 20.6.2008

Репутация: нет
Всего: 1

Да

В общем, более конкретно:

Код


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
                    "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>

  <script>
 $("body *").mouseover(function(e){        
    e.target.className = "border";
});
$("body *").mouseout(function(e){
    e.target.className = "";    
});
  </script>

  <style>
  div,span,p {
    width: 150px;
    height: 60px;
    float:left;
    padding: 10px;
    margin: 10px;
    background-color: #EEEEEE;
  }
   </style>
   <style>
.border {
border:3px solid blue;
}
</style>
</head>
<body>
  <div>DIV</div>
  <span>SPAN</span>

  <p>P <button>Button</button></p>
</body>
</html>

Это сообщение отредактировал(а) programming - 30.8.2010, 13:03

--------------------

<удалено администрацией>

CruorVult

Дата 30.8.2010, 13:04 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 868
Регистрация: 24.9.2008
Где: г.Киев, Украина

Репутация: 1
Всего: 28

в IE не работает?

programming

Дата 30.8.2010, 13:05 (ссылка)

(нет голосов)

Загрузка ...

Бывалый

Профиль
Группа: Участник
Сообщений: 227
Регистрация: 20.6.2008

Репутация: нет
Всего: 1

Проблема решена.
Забыл прописать $(document).ready(function(){ });

Это сообщение отредактировал(а) programming - 30.8.2010, 13:05

--------------------

<удалено администрацией>

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Применение библиотек \| Следующая тема »