Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
MySQL 5. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. PHP. Практика создания Web-сайтов (второе издание). Авторы: Кузнецов М.В., Симдянов И.В. PHP на примерах (2 издание). Авторы: Кузнецов М.В., Симдянов И.В. PHP 5. На примерах. Авторы: Кузнецов М.В., Симдянов И.В., Голышев С.В. Самоучитель MySQL 5. Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: эффект в формуляре
 
 автор: cccp   (26.09.2006 в 05:16)   письмо автору
 
 

Добрый день.
Подскажите пожалуста, если кто знает.
Я где-то видел такой эффект в одном формуляре.

Эффект таков:
В формуляре поля.

Поля все одного цвета.
Типо, все пустые поля красным цветом.
Когда поле заполненно, то оно меняет цвет.

Как это сделать?

Зарание спасибо.

   
 
 автор: tuder   (26.09.2006 в 08:40)   письмо автору
 
   для: cccp   (26.09.2006 в 05:16)
 

http://xprogramming.narod.ru/books/dhtml/10/10.htm#12

В это разделе последний пункт. Поиск по "Представление требуемой информации"

   
 
 автор: AlexSol   (26.09.2006 в 10:08)   письмо автору
 
   для: tuder   (26.09.2006 в 08:40)
 

http://www.lessio.ru/css-js/4/ вот урок

   
 
 автор: tuder   (26.09.2006 в 11:34)   письмо автору
 
   для: AlexSol   (26.09.2006 в 10:08)
 

Не тому учишь. Я мог вот на это ссылку дать:

http://www.ms-access.ru/js_forms.html
http://www.ms-access.ru/js_forms_11.html

Только вот вопрос не про подсветку во время наведения курсора. А про изменение цвета после ввода данных.

   
 
 автор: AlexSol   (26.09.2006 в 11:46)   письмо автору
 
   для: tuder   (26.09.2006 в 11:34)
 

зная как обращатся к свойствам остальное можно додумать.

   
 
 автор: cccp   (26.09.2006 в 12:20)   письмо автору
 
   для: AlexSol   (26.09.2006 в 11:46)
 

Спасибо всем за ответы.
То что было указано в первой ссылке , вроде бы подходит.
Только вот там как буд-то бы тема на до конца написана.
Вот отрывок:

Представление требуемой информации

Расширение приведенного выше примера, которое продемонстрировано в приведенном ниже коде, заключается в использовании для отображения заполняемых полей другого цвета фона. При вводе пользователем информации в этих полях цвет фона изменяется на цвет по умолчанию, что помогает пользователю определить поля, которые следует заполнить перед отправкой формы.


<HTML>
<HEAD>
<TITLE> Представление требуемой информации </TITLE>
<STYLE TYPE="text/css">
.required {background: red}
</STYLE>
<SCRIPT LANGUAGE="JavaScript">
function isEmpty(str) {
for (var intLoop = 0; intLoop<str.length; intLoop++)
if (" " != str.charAt(intLoop))
return false;
return true;
}

function checkRequired(f) {
for (var intLoop = 0;
intLoop<f.elements.length; intLoop++)
if ("required"==f.elements[intLoop].className) {
alert("All red fields are

   
 
 автор: AlexSol   (26.09.2006 в 12:31)   письмо автору
 
   для: cccp   (26.09.2006 в 12:20)
 


<input type="text" name="name" id="field1" class="formm"   onBlur="if(this.value!=''){this.style.background='#999'}else{this.style.background='#fff'}; ">

   
 
 автор: cccp   (26.09.2006 в 12:52)   письмо автору
 
   для: AlexSol   (26.09.2006 в 12:31)
 

Спасибо.
Оказывается всё на много проще.

   
 
 автор: tuder   (26.09.2006 в 13:37)   письмо автору
 
   для: cccp   (26.09.2006 в 12:20)
 

Вот пример:
http://files.byte.nsk.su/tt/zap.php
При этом если удалишь данные из кода, то поле снова становится красным.

Вот код:

<HTML>
   <HEAD>
      <TITLE> Представление требуемой информации </TITLE>
      <STYLE TYPE="text/css">
         .required {background: red}
      </STYLE>
      <SCRIPT LANGUAGE="JavaScript">
         function isEmpty(str) {
            for (var intLoop = 0; intLoop<str.length; intLoop++)
               if (" " != str.charAt(intLoop))
                  return false;
            return true;
         }

         function checkRequired(f) {
            for (var intLoop = 0;
               intLoop<f.elements.length; intLoop++)
               if ("required"==f.elements[intLoop].className) {
                  alert("All red fields are required.");
                  return false;
               }
         }

         function fixUp(el) {
            el.className = isEmpty(el.value) ? "required" : "";
         }

         function checkChar(el) {
            if (32 != event.keyCode)
               el.className = "";
         }
      </SCRIPT>
   </HEAD>
   <BODY>
      <FORM NAME="demo" ONSUBMIT="return checkRequired(this);">
         User Name:
            <INPUT TYPE=TEXT CLASS="required"
               ONKEYPRESS="checkChar(this);"
               ONCHANGE="fixUp(this);"><BR>
         E-Mail Address:
            <INPUT TYPE=TEXT CLASS="required"
               ONKEYPRESS="checkChar(this);"
               ONCHANGE="fixUp(this);"><BR>
         Age (optional):
            <INPUT TYPE=TEXT SIZE=3><BR>
         <INPUT TYPE=SUBMIT VALUE="Submit">
      </FORM>
   </BODY>
</HTML>

   
 
 автор: cccp   (26.09.2006 в 23:17)   письмо автору
 
   для: tuder   (26.09.2006 в 13:37)
 

Mucha Graciac Amigo !
:)))

   
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования