Меню на Javascript
сем привет. :)
Есть время свободное и захотел сайт сделать. С версткой НТМЛ проблем нет(кроме блочной, которую я не знаю), но захотелось сделать менюшку с меняющимися кнопками. Есть 2 варианта: 1. Сделать кнопки рисунками, но надо будет рисовать по 2 кнопки с текстом, а если потом добавлять, то еще и дорисовывать. + сайт будет много весить. 2. Менять фоновые изображения в каждой клетке меню при наведении. Я в ДжаваСкриптах не шарю. Нашел в Интернет только, как фоновые цвета менять при наведении. Я её отредактировал, но что-то с картинками не получается. Подскажите, где подправить? <script type="text/JavaScript">
<!--
function newColor(idCell1) {
eval('document.all.'+idCell1+'.style.background-image= "url(images/hov_gr_but.jpg)"');
eval('document.getElementById("' + idCell1 + '").style.background-image= "url(images/hov_gr_but.jpg)"');
}
function backColor(idCell1) {
eval('document.all.'+idCell1+'.style.background-image = "url(images/hov_bl_but.jpg)"');
eval('document.getElementById("' + idCell1 + '").style.background-image = "url(images/hov_bl_but.jpg)"');
}
//-->
</script>
<table width="163" cellpadding="10" cellspacing="0" align="center">
<tr height="44" onMouseOver="newColor('c1')" onMouseOut="backColor('c1')">
<td id="c1" background="./images/hov_gr_but.jpg">1</td>
</tr>
<tr height="44">
<td background="./images/hov_bl_but.jpg">2</td>
</tr>
<tr height="44">
<td background="./images/hov_bl_but.jpg">3</td>
</tr>
<tr height="44">
<td background="./images/hov_bl_but.jpg">4</td>
</tr>
<tr height="44">
<td background="./images/hov_bl_but.jpg">5</td>
</tr>
</table>
При наведении пункт меню становится зеленым П.С. Пишу уже на третий форум (теперь специализированный). Нигде так и не помогли :( |
function newColor(idCell1) {
document.getElementById(idCell1).style.backgroundImage= "url(images/hov_gr_but.jpg)";
}
function backColor(idCell1) {
document.getElementById(idCell1).style.backgroundImage= "url(images/hov_bl_but.jpg)";
}
|
Большое спасибо.
А можно вкратце, почему мой вариант не работаьл? :) |
style.background-image
в CSS есть такое свойство.а вот в JS нету.в JS нельзя использовать в именнах переменных и свойств знак "-" поэтому, когда JS обращается к свойствам CSS через style, то дефисы удаляются, а следующие за ними буквы пишутся заглавными в данном случае backgroundImage PS это далеко не единственный минуч вашего скрипта изначального. он ужасен неизвестно для чего используются eval-ы.к тому же обращение к document.all есть не везде, и не везде оно одинаково работает. а там, где он есть он в лучшем случае эквивалентен втиорой строчке |
Спасибо.:)
Лучше и не брать за эти скрипты, а использовать готовые скрипты. %) |
что не брать?
может быть вы хотели сказать "не братся"? тогда вы будете на каждую строчку JS обращатся на форум за помощью по видоизменению. это всем очень быстро надоест. |
Вот пример сайта http://pasha4ur.narod.ru/. Правда лучше всего открывать в Опере. Я просто старый скрипт из книжки вставил и
за курсором мышки шарики двигаются только в Опере. В ФФ они тупо лежат внизу, а Интернет Эксплоуер начинает тупо тормозить весь комп. Есть еще пару вопрос, но думаю не стоит создавать темы по ним (а то тупые темки получаться от чайника :)))): 1. Можете дать ссылку, где есть много бесплатных джава-скриптов? А то я на диал-апе уже запарился искать %) 2. Искал в Интернете, но так и не нашел учебник/урок, чтобы понять, что такое блочная верстка. Но это же намного круче тбличной? не подкинете парочку? :) 3. Хотел сделать сайт полупрозрачным (рисунки фоновые в PNG), но в Эксплоуере все же неправильно отображается. Нашел решение для обычных рисунков. Нет ли уже какого-нибудь скрипта, чтобы и фоновые картинки нормально отображались?? Большое спасибо за ответы!!! |
1.бесплатные скрипты лучше брать из головы.
потому что на большинстве сайтов с бесплатными скриптами, они устаревши до ужаса. не знаю сайтов с нормальными скриптами. вот тут есть , но старье.Если будете использовать, не обращайтесь потом с "скрипт не работает"/"надо переделать" .тут мало у кого есть желание копатся в таком некачественном продукте. вывод:изучайте сами, и пишите.мы поможем если что.такие задачи нам интереснее разбирать как правило, чем бесплатный хлам 2.тут вроде есть статьи по поводу верстки слоями.не читал,и оченить не могу, так как версткой плотно не занимаюсь 3.не знаю. |
Цитата:
Лично я бы посоветовал решение Виталия Харисова http://company.yandex.ru/experience/ доклад "CSS Framework своими руками: практика" |
Gvozd, сорри не могу тебе "+" добавить. Спасибо. Пишет какую-то фигню: "Вы должны поставить кому-то еще перед....."
У меня с программированием что-то совсем тяжко идет. Я больше гумманитарий(в школе учился на медицинском, а в техникум "попал" на программиста, но нас там ничему и не учили). НТМЛ правда дался легко! Kolyaj, спасибо! Буду читать. Очень хочется прозрачным сделать! Не можете подсказать, что сделать, чтобы шарики за курсором в ФФ и ИЕ нормально двигались? |
| Часовой пояс GMT +3, время: 00:31. |