Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате
Форум программистов > JavaScript: для новичков > не работает - document.getElementByID(id).src


Автор: 4epT 22.11.2008, 20:39
Добрый вечер!

Пытаюсь сделать менб с помощью JavaSript ... вот код:
Код

<html>
    <head>
        <title>Index</title>
        <style type="text/css">
        td.paddingtext:hover
        {
            padding: 9px; /* Поля вокруг текста */
            padding-left: 25px; /* Поля вокруг текста */
            padding-right: 25px; /* Поля вокруг текста */
            background-image: url("img/main-buttonOver-tile.jpg");
        }
        td.paddingtext
        {
            padding: 9px; /* Поля вокруг текста */
            padding-left: 25px; /* Поля вокруг текста */
            padding-right: 25px; /* Поля вокруг текста */
            background-image: url("img/main-button-tile.jpg");
        }
        </style>
    </head>
    <body style="width:100%;height:100%;" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
        <table style="width:100%;height:100%;" border="1" cellspacing="0" cellpadding="0" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
            <tr>
                <td valign="top" align="center">
                    <table cellspacing="0" cellpadding="0" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
                        <tr>
                            <td><img src="img/main-header.png" /></td>
                            <!--BUTTON 1 -->
                            <td onmouseover="check('1')" onmouseout="uncheck('1')"><img id="1left" src="img/main-button-left.jpg" /></td>
                            <td onmouseover="check('1')" onmouseout="uncheck('1')" class="paddingtext" marginheight="20" valign="bottom" style=" cursor:pointer; color:white;">
                                Текст 1
                            </td>
                            <td onmouseover="check('1')" onmouseout="uncheck('1')"><img id="1right" src="img/main-button-right.jpg" /></td>
                            <!--BUTTON 1 END-->
                            <!--BUTTON 2 -->
                            <td><img src="img/main-button-left.jpg" /></td>
                            <td class="paddingtext" marginheight="20" valign="bottom" style=" cursor:pointer; color:white;">
                                Текст 2
                            </td>
                            <td><img src="img/main-button-right.jpg" /></td>
                            <!--BUTTON 2 END-->
                            <!--BUTTON 3 -->
                            <td><img src="img/main-button-left.jpg" /></td>
                            <td class="paddingtext" marginheight="20" valign="bottom" style=" cursor:pointer; color:white;">
                                Текст 3
                            </td>
                            <td><img src="img/main-button-right.jpg" /></td>
                            <!--BUTTON 3 END-->
                            <!--BUTTON 4 -->
                            <td><img src="img/main-button-left.jpg" /></td>
                            <td class="paddingtext" marginheight="20" valign="bottom" style=" cursor:pointer; color:white;">
                                Текст 4
                            </td>
                            <td><img src="img/main-button-right.jpg" /></td>
                            <!--BUTTON 4 END-->
                            <td><img src="img/main-footer.png" /></td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        <script type="text/javascript" src="js/sc.js"></script>
    </body>
</html>


Код

function check(index)
{
    var indexl = index + "left";
    var indexr = index + "right";    
    document.getElementByID(indexl).src = "img/main-buttonOver-left.jpg";
    document.getElementByID(indexr).src = "img/main-buttonOver-right.jpg";
}

function uncheck(index)
{
    var indexl = index + "left";
    var indexr = index + "right";    
    document.getElementByID(indexl).src = "img/main-button-left.jpg";
    document.getElementByID(indexr).src = "img/main-button-right.jpg";
}


document.getElementByID(indexl).src = "img/main-buttonOver-left.jpg"; - не работает не в ИЕ не в Мозиле .... в чем может быть проблема ?
В ИЕ даже не работают стили - td.paddingtext:hover

Жду ответов )))

Автор: destrd 22.11.2008, 20:42
Цитата(4epT @  22.11.2008,  20:39 Найти цитируемый пост)
document.getElementByID(indexl).src

ЕМНИП, там надо value

Автор: 4epT 22.11.2008, 20:49
Цитата(destrd @ 22.11.2008,  20:42)
Цитата(4epT @  22.11.2008,  20:39 Найти цитируемый пост)
document.getElementByID(indexl).src

ЕМНИП, там надо value

не понял ... где value ? мне нужно при onmouseover сменить в 2-ух img src

Автор: destrd 22.11.2008, 20:50
Цитата(4epT @  22.11.2008,  20:49 Найти цитируемый пост)
 мне нужно при onmouseover сменить в 2-ух img src

Тогда попробуйте item.setAttribute(src, "myimg.jpg")

Автор: bars80080 22.11.2008, 21:03
 smile ошибка синтаксиса, следим за регистром

не document.getElementByID
а document.getElementById

Цитата(4epT @  22.11.2008,  19:39 Найти цитируемый пост)
В ИЕ даже не работают стили - td.paddingtext:hover

тоже читаем документацию. в ИЕ6 :hover действет только для ссылок

Автор: 4epT 22.11.2008, 21:24
Цитата(bars80080 @ 22.11.2008,  21:03)
smile ошибка синтаксиса, следим за регистром

не document.getElementByID
а document.getElementById

Цитата(4epT @  22.11.2008,  19:39 Найти цитируемый пост)
В ИЕ даже не работают стили - td.paddingtext:hover

тоже читаем документацию. в ИЕ6 :hover действет только для ссылок

Получилось, спасибо! )
И еще один вопрос ... как можно применять вот это свойство - 
background-image: url("img/main-buttonOver-tile.jpg"); без применения CSS ... тоесть мне нужно мои стили заменять на кол JacaSript )

Автор: bars80080 23.11.2008, 02:17
можно, соответствующим способом:
Код

.style.backgroundImage = 'img/main-buttonOver-tile.jpg';

Автор: 4epT 24.11.2008, 02:30
Цитата(bars80080 @ 23.11.2008,  02:17)
можно, соответствующим способом:
Код

.style.backgroundImage = 'img/main-buttonOver-tile.jpg';

Не получается (

Автор: bars80080 24.11.2008, 10:22
ну, значит, надо было покопаться в документации

Код

<html>
<head>
<script>
function qw() {
    var el = document.body;
    el.style.backgroundImage = 'url(zzz.jpg)';
}
</script>
</head>
<body>
<input type="button" value="aga!" onclick="qw();" />
</body>
</html>
так работает

Автор: 4epT 24.11.2008, 13:16
Спасибо все получилось ))
Кто может подсказать почему в мозиле не работает такой код:
Код

...
<a href="index.html">
        <td>
                  Текст1
        </td>
</a>
...


Ссылка не работает ( в ИЕ все нормально ...

Автор: skyboy 24.11.2008, 14:05
а ничего, что в tr могут находиться td/th/colgroup? что ж ты <a> туда вставляешь?

Автор: 4epT 24.11.2008, 15:01
Цитата(skyboy @ 24.11.2008,  14:05)
а ничего, что в tr могут находиться td/th/colgroup? что ж ты <a> туда вставляешь?

ну я хочу сделать весь <td> ссылкой ... в не только текст в нем ... как это можно сделать ? в ИЕ такой способ как я писал работает ...

Автор: bars80080 24.11.2008, 15:17
Цитата(4epT @  24.11.2008,  14:01 Найти цитируемый пост)
в ИЕ такой способ как я писал работает ... 

это баг. у каждого тэга есть перечень тех тэгов, которые могут в него входить, и тех в которые он может входить.

ссылку ты можешь сделать просто: <td onclick="">, либо <td><a href=""></a></td>

а для 
Цитата(4epT @  24.11.2008,  14:01 Найти цитируемый пост)
я хочу сделать весь <td> ссылкой 

достаточно назначить нужные стили: 
Код

a { display: block; width: 100%; /* или фиксированную*/ height: 100%; }

Автор: 4epT 24.11.2008, 15:39
Спасибо, все работает ... сделал через onclick="".
Через стили немного не так ...

Автор: bars80080 24.11.2008, 16:18
через стили можно сделать, причём будет так как надо. плюс преимущество :hover будет действовать в ИЕ, и можно не беспокоиться, что javascript отключат

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)