PDA

Просмотр полной версии : onMouseOver+CSS+JavaScript - как их объединить


Lidia
18.02.2006, 04:32
Здравствуйте.
Опять у меня одна шальная мысль в голове застряла :D. А именно: хочу сделать так, что при наведении на место менялся цвет ячейки, цвет букв. Поняла как сделать это для onmouseover="this.bgColor='navy';this.style.color='yellow';
А если у меня 150 таких ячеек, то как то мало интересного прописывать такое 150 раз. Выход вижу в использовании JavaScript, только не очень могу это связать: function up{
this.bgColor='navy';
this.style.color='yellow'}
...onmouseover="up()"
Ничего не даёт мне (ничего не меняется) :( В чём моя ошибка? :confused:
И второй вопрос (должен быть в тему): возможно ли прописать в JavaScript такое, используя файл CSS, т.е. что-то типо такого function up{p class='.cssFunction'}?

Заранее спасибо,
Лидия

Crazy
18.02.2006, 11:03
RTFM attachEvent

Crazy
18.02.2006, 11:05
Ответ на второй вопрос: да можно. Вот только не надо фантазировать на тему синтаксиса -- нужно купить книжку и прочитать, как это пишется.

Lidia
18.02.2006, 13:06
Конечно, когда в этом деле соображаешь, то проще послать новичков куда подальше. Руку помоще протянуть сложнее.

KidsKilla
18.02.2006, 13:45
лидия. нормальное дело. те сказали направление и отправили в поиски, нутк и в чём дело? =)

про 1е: аттачЕвент не обязательно, достаточно пробежаться по таблице и давать всем ячейкам онмауовер.
ток пишется он не ...onmouseover="upFunc()"
а ...onmouseover=upFunc;
понадобятся ф-ции .getElwmwntById() и .getElementsByTagName()

про 2е:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled</title>
<style>
#element{cursor:pointer;cursor:hand;}
.active{background:red;color:#fff;}
</style>
<script type="text/javascript">
function activate(elId){
var el = document.getElementById(elId);
el.onclick = function(){
if(this.className.indexOf("active")==-1){
this.className+=' active';
} else {
this.className=this.className.replace(' active','')
}
}
}
</script>
</head>
<body>
<div id="element">
текст
</div>
<script>
activate("element");
</script>
</body>
</html>

Crazy
18.02.2006, 13:53
Конечно, когда в этом деле соображаешь, то проще послать новичков куда подальше. Руку помоще протянуть сложнее.

Ты путаешь help и spoil. Портить новичков, подсовывая им готовое решение, в котором они все равно ничего не поймут -- самое худшее, что можно сделать.

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

deathstorm
18.02.2006, 14:00
чтобы менялся фон таблицы к примеру можно поюзать css :hover к примеру
а чтобы менялся цвет букв (и таблиц), попробуй так
document.onmousemove=cColor

function cColor()
{
if(event.srcElement=='твой элемент')
{event.srcElement.class='нужный класс'}
}

ну а для кроссбраузерности придется попотеть