Pasha

Получилось решить проблему с помощью transition, чтобы менюшка скрывалась не сразу после щелчка где-нибудь http://jsfiddle.net/Pasha/NXaHY/16/

Теперь я просто уже не знаю что делать, это мне никак непонятно. Код уже просто скопировал полностью, вторую менюшку закоментировал и ссылки не работают! Это просто... ужас((

ужасные у тебя конструкции... Кое-что переделал по своему: _http://jsfiddle.net/NXaHY/3/ На jsfiddle.net ссылки не могут открываться в этом же окне. Всё бы ничего, но почему-то при встраивании на сайт не только менюшка съезжает, но ещё почему-то и вторая которая, находится далековато от этой. И ещё если менюшку закрыть, не кликнув на ссылки, то ссылки скрываются, но я всё равно могу нажать на них, они просто становятся невидимыми.

Неожиданно появилась ещё одна очень не понятная мне проблема, в менюшке не работают ссылки, ничего не происходит при клике, правильно работает только в webkit. http://jsfiddle.net/Pasha/NXaHY/ Помогите, пожалуйста, решить проблему.

Уууу практически получилось Только при клике вёрстка едет, а так работает. http://jsfiddle.net/Pasha/LtTPn/

iOS - это iPad, iPhone, iPod, на маках Mac OS X Проверял на iPad через стандартный safari в iOS 6.0.1. http://jsfiddle.net/dpckP/1/

* значит, что для всех элементов страницы будут применены стили в фигурных скобках. Справки по свойствам: margin, padding.

Viper, к сожалению не получилось сделать вашим способом. Вот сам я что-то умудрился сделать, через a:focus + блок с меню {стили}. Работает практически правильно. Единственное, что чтобы закрыть меню надо щёлкнуть где-нибудь по сайту, на клике же по стрелочке меню не закрывается. И ещё такая менюшка не работает на iOS Помогите, пожалуйста, довести до ума.

Тоже была идейка сделать чекбоксом, но пока не пробовал реализовать. А как на Javascript сделать можно?

Сделал выпадающую менюшку на чистом css, да вот не задача: работает всё это как-то кривовато, можно посмотреть тут http://cloverdesign.ru/wordpress/ (чёрная стрелочка рядом с синей штуковиной). Спокойно можно поднести мышку и нажать на стрелочку, если использовать :active вместо :hover, но тогда выпадающая менюшка видна только во время клика. Подскажите, пожалуйста, как можно сделать так, чтобы и поднести можно было курсор спокойно и, чтобы менюшка всегда после клика отображалась пока ещё куда-нибудь не тыкну?

Оооууу Спасибо! Но я пока никакой защиты вставлять не буду по некоторым причинам. А как мне теперь запилить всякие новые инпуты и селект в php код? Ну понятно можно создать новые переменные по образцу тех, что есть, но как их добавить в, отправляемое на ящик, сообщение?

Да, вижу, но при этом на другом сайте, для которого делалась изначально форма всё работает. Эту форму я взял из того сайта, добавил новое, убрал капчу. Вроде бы должно хоть что-то происходить, сообщение с ошибкой, например, но не происходит ничего( Т.к. я взял старую форму и добавил в неё некоторые новые штучки, а рекапчу убрал, то теперь нужно переделать js и php (или только php, я не знаю точно) так, чтобы все данные из новой формы отправлялись.

есть форма: <form method="post" name="sendform" id="sendform"> <input type="text" name="name" class="inputtext" id="name" value="" placeholder="for example John Jonson" /> <input type="tel" name="tel" class="inputtext" id="tel" value="" placeholder="for exapmle 8 123 4567890" /> <input type="text" name="address" class="inputtext" id="adres" value="" placeholder="for example 27 Oak Street Tenafly, NJ, 07670, USA" /> <input type="email" name="email" class="inputtext" id="email" value="" placeholder="for example john.jonson@email.com" /> <select class="country_select" size="1" name="country_select"> <option value="">[Select]</option> <option value="Russia">Russian Federation</option> <option value="USA">USA</option> <option value="England">England</option> <option value="Germany">Germany</option> <option value="France">France</option> </select> <div class="slider"> <script type="text/javascript"> $(window).load(function () { $('.RememberMe :checkbox').iphoneStyle({ checkedLabel: 'Yes', uncheckedLabel: 'No' }); }); </script> <div class="RememberMe"> <input id="first_slider" type="checkbox" checked="checked" ></input> </div> </div> <div class="slider"> <script type="text/javascript"> $(window).load(function () { $('.RememberMe :checkbox').iphoneStyle({ checkedLabel: 'Yes', uncheckedLabel: 'No' }); }); </script> <div class="RememberMe"> <input id="second_slider" type="checkbox" ></input> </div> </div> <div class="slider"> <script type="text/javascript"> $(window).load(function () { $('.RememberMe :checkbox').iphoneStyle({ checkedLabel: 'Yes', uncheckedLabel: 'No' }); }); </script> <div class="RememberMe"> <input id="third_slider" type="checkbox" disabled="disabled" checked="checked"></input> </div> </div> <div class="slider"> <script type="text/javascript"> $(window).load(function () { $('.RememberMe :checkbox').iphoneStyle({ checkedLabel: 'Yes', uncheckedLabel: 'No' }); }); </script> <div class="RememberMe"> <input id="last_slider" type="checkbox" disabled="disabled"></input> </div> </div> <div class="radioandcheckbox"> <input id="first_checkbox" type="checkbox" name="first_checkbox" checked hidden /> <label for="first_checkbox"></label> </div> <div class="radioandcheckbox"> <input id="second_checkbox" type="checkbox" name="second_checkbox" hidden /> <label for="second_checkbox"></label> </div> <div class="radioandcheckbox"> <input id="third_checkbox" type="checkbox" name="third_checkbox" hidden disabled /> <label for="third_checkbox"></label> </div> <div class="radioandcheckbox"> <input id="last_checkbox" type="checkbox" name="last_checkbox" checked hidden disabled /> <label for="last_checkbox"></label> </div> <div class="radioandcheckbox"> <input id="first_radio" type="radio" name="radio" checked hidden /> <label for="first_radio"></label> </div> <div class="radioandcheckbox"> <input id="second_radio" type="radio" name="radio" hidden /> <label for="second_radio"></label> </div> <div class="radioandcheckbox"> <input id="third_radio" type="radio" name="radio" hidden disabled /> <label for="third_radio"></label> </div> <textarea name="message" id="message"></textarea> <div class="tf"> <input type="file" size="26" id="addfile" onchange='document.getElementById("filesource").value=this.value' /> <div class="img"></div> <input id="filesource" type="text" /> </div> <input type="submit" class="formbutton" value="Send" name="sendbtn" id="sendbtn" /></td> </form> есть js для работы формы: $(document).ready(function() { $("#sendform").submit(function(event) { event.preventDefault(); $.post("send.php", $("#sendform").serialize(), function(data) { if (data == 'capcha') alert('Вы неправильно ввели проверочное слово!'); if (data == 'sent') { $('#sendform').trigger( 'reset' ); alert('Заявка отправлена!'); } if (data == 'unsent') alert('Ошибка отправления данных!'); }); }); }); И php, чтобы отправлять данные: <?php require_once('recaptchalib.php'); $privatekey = ''; $resp = recaptcha_check_answer ($privatekey,$_SERVER['REMOTE_ADDR'],$_POST['recaptcha_challenge_field'],$_POST['recaptcha_response_field']); $valid = $resp->is_valid; if (!$valid) print('capcha'); else { $name = trim($_POST['name']); $tel = trim($_POST['tel']); $adres = trim($_POST['adres']); $email = trim($_POST['email']); $message = trim($_POST['message']); $address = 'user@email.com'; $sub = "Кто-то оставил заявку"; $mes = "Автор назвался: $name \n\n Указал свои контактный номер: $tel \n\n Указал свой адрес: $adres \n\n Указал свой email: $email \n\n Содержание письма: $message"; $verify = mail($address,$sub,$mes,"Content-type:text/plain; charset = utf-8\r\nFrom:$name"); if($verify) print('sent'); else print('unsent'); } ?> Изначально форма была сделана для другого сайта, а js и php были сделаны моим знакомым, который сейчас в армии. Сейчас я сделал новую форму с новыми плюшками: input type="checkbox", input type="radio", input type="file", select. реКапчу убрал. Сам я в js и php полный ноль (пока) поэтому хочу спросить совета у вас: что нужно прописать в js и php, чтобы форма работала (сейчас по нажатию на кнопку ничего не происходит)?

Фон глаза режет. Так же в менюшке справа надо бы изменить цвет текста при наведении, ибо серое на оранжевом не катит.

В html, в блоке с классом posts пишите имя класса без точки: class="posts"