Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Вывести кнопку на экран (https://javascript.ru/forum/dom-window/46709-vyvesti-knopku-na-ehkran.html)

vas88811 20.04.2014 12:53

Вывести кнопку на экран
 
В этом коде кнопка but1 убирается с экрана и потом при вызове функции f1 добавляется. А как сделать чтобы этой кнопки изначально не было на экране, а потом можно было бы также ее добавить?


<p id="but1"><a onClick="f1();" class="myButton1">Выбрать</a></p>
<p><a onClick="f1();" class="myButton2">Выбрать</a></p>

<script type="text/javascript">
document.getElementById("but1").style.display='non e';

function f1() {
document.getElementById("but1").style.display=' ';
}
</script>

Sweet 20.04.2014 13:49

Цитата:

Сообщение от vas88811
как сделать чтобы этой кнопки изначально не было на экране, а потом можно было бы также ее добавить?

Пропиши display:none в css, а скриптом накатывай display:block.

vas88811 20.04.2014 14:28

Цитата:

Сообщение от Sweet (Сообщение 308499)
Пропиши display:none в css, а скриптом накатывай display:block.

display:none в css прописал, а по поводу display:block не понял... это куда надо прописать?

vas88811 20.04.2014 14:33

Цитата:

Сообщение от vas88811 (Сообщение 308503)
display:none в css прописал, а по поводу display:block не понял... это куда надо прописать?

Все, разобрался. просто document.getElementById("but1").style.display='blo ck';
Спасибо.

vas88811 20.04.2014 15:10

Цитата:

Сообщение от vas88811 (Сообщение 308504)
Все, разобрался. просто document.getElementById("but1").style.display='blo ck';
Спасибо.

А вот с кнопкой как раз не работает..




<style type="text/css">
body {
background-image: url(images/); /* Путь к фоновому
}
.myButton1 {
background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #0b6db8), color-stop(1, #9fc1ed));
background:-moz-linear-gradient(top, #0b6db8 5%, #9fc1ed 100%);
background:-webkit-linear-gradient(top, #0b6db8 5%, #9fc1ed);
background:-o-linear-gradient(top, #0b6db8 5%, #9fc1ed 100%);
position:relative;
top:440px;
left:39px;
display:none;
}
</style>

</head>
<body>

<p id="but1"><a onClick="q1();" class="myButton1">Выбрать</a></p>
<p id="but2"><a onClick="q2();" class="myButton2">Выбрать</a></p>


<script type="text/javascript">

function q2() {

document.getElementById("but1").style.display='blo ck';
}

</script>


При вызове функции q1 кнопка не появляется.. Как правильно сделать?

Sweet 20.04.2014 15:57

vas88811, на будущее: Оформляй нормально код.
Цитата:

Сообщение от vas88811
При вызове функции q1 кнопка не появляется..

Ты прячишь a.myButton1, а display:block делаешь для div#but1. Это ж разные элементы.

vas88811 20.04.2014 17:14

Цитата:

Сообщение от Sweet (Сообщение 308511)
vas88811, на будущее: Оформляй нормально код.

Ты прячишь a.myButton1, а display:block делаешь для div#but1. Это ж разные элементы.

Я понял. Вы можете показать, как нужно правильно сделать? Или хотя бы скажите, про что нужно почитать.. Я не могу в нете инфу найти.

vas88811 20.04.2014 18:59

попробовал в css написать #button1 и вызывать document.getElementById("button1").style.display=' block';
Так кнопка появляется, но какая-то огромная. в ширину экрана

Sweet 20.04.2014 19:02

<style>
#but1 {
  display: none;
}
</style>

<p id="but1"><a class="myButton1">Выбрать</a></p>
<p id="but2"><a onClick="q2();" class="myButton2">Выбрать</a></p>

<script>

function q2() { 
    document.getElementById("but1").style.display = 'block';
    return false; 
}

</script>

Sweet 20.04.2014 19:07

Цитата:

Сообщение от vas88811
Так кнопка появляется, но какая-то огромная. в ширину экрана

Ты остави стили у a.myButton1, а для div#but1 сделай отденьно display:none.


Часовой пояс GMT +3, время: 18:15.