Delat
-
Posts
145 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by Delat
-
никто не поможет? ???
-
извините, не увидел. Сейчас добавил вот такую строчку, повыше основного js-кода: https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js но по прежнему ничего нет <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <script type="javascript"> $(window).ready(function(){ p = $('.popup__overlay') $('#popup__toggle').click(function() { p.css('display', 'block') }) p.click(function(event) { e = event || window.event if (e.target == this) { $(p).css('display', 'none') } }) $('.popup__close').click(function() { p.css('display', 'none') }) }); </script>
-
сделал, но все равно нет модального окна <script type="javascript"> $(window).ready(function(){ p = $('.popup__overlay') $('#popup__toggle').click(function() { p.css('display', 'block') }) p.click(function(event) { e = event || window.event if (e.target == this) { $(p).css('display', 'none') } }) $('.popup__close').click(function() { p.css('display', 'none') }) }); </script>
-
Почему не работает? А здесь работает. <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <meta name="description" content=""> <meta name="keywords" content=""> <link rel="stylesheet" href="css.css"> <script type="javascript"> p = $('.popup__overlay') $('#popup__toggle').click(function() { p.css('display', 'block') }) p.click(function(event) { e = event || window.event if (e.target == this) { $(p).css('display', 'none') } }) $('.popup__close').click(function() { p.css('display', 'none') })</script> </head> <body> <p><input type="button" value="Popup!" id="popup__toggle" /></p> <div class="popup__overlay"> <div class="popup"> <a href="#" class="popup__close">X</a> <h2>Welcome!</h2> <p>Please enter your login and password to continue</p> <div class="popup-form__row"> <label for="popup-form_login">Login</label> <input type="text" id="popup-form_login" value="" /> </div> <div class="popup-form__row"> <label for="popup-form_password">Password</label> <input type="password" id="popup-form_password" value="" /> </div> <input type="button" value="Log in" /> </div> </div> </body> </html> html { min-height: 100% } body { min-height: 100%; background: #fff; font: 14px/125% Tahoma; } p { margin: 1em 0; text-align: center } .popup__overlay { display: none; position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,.7); text-align: center } .popup__overlay:after { display: inline-block; height: 100%; width: 0; vertical-align: middle; content: '' } .popup { display: inline-block; position: relative; max-width: 80%; padding: 20px; border: 5px solid #fff; border-radius: 15px; box-shadow: inset 0 2px 2px 2px rgba(0,0,0,.4); background: #fff; vertical-align: middle } .popup-form__row { margin: 1em 0 } label { display: inline-block; width: 120px; text-align: left } input[type="text"], input[type="password"] { margin: 0; padding: 2px; border: 1px solid; border-color: #999 #ccc #ccc; border-radius: 2px } input[type="button"] { padding: 6px 16px; border: 0; border-radius: 2px; -webkit-box-shadow: inset 0 1px 1px rgba(255,255,255,.3); box-shadow: inset 0 1px 1px rgba(255,255,255,.3); cursor: pointer; background: #444; background: -webkit-linear-gradient(90deg, #515151, #333 48%, #333 52%, #515151 100%); background: -moz-linear-gradient(90deg, #515151, #333 48%, #333 52%, #515151 100%); background: -ms-linear-gradient(90deg, #515151, #333 48%, #333 52%, #515151 100%); background: -o-linear-gradient(90deg, #515151, #333 48%, #333 52%, #515151 100%); background: linear-gradient(90deg, #515151, #333 48%, #333 52%, #515151 100%); color: #fff } .popup__close { display: block; position: absolute; top: -20px; right: 10px; width: 12px; height: 12px; padding: 8px; border: 5px solid #fff; border-radius: 50%; -webkit-box-shadow: inset 0 2px 2px 2px rgba(0,0,0,.4), 0 3px 3px rgba(0,0,0,.4); box-shadow: inset 0 2px 2px 2px rgba(0,0,0,.4), 0 3px 3px rgba(0,0,0,.4); cursor: pointer; background: #fff; text-align: center; font-size: 12px; line-height: 12px; color: #444; text-decoration: none; font-weight: bold } .popup__close:hover { background: #ddd }
-
спасибо за пример, но это не подходит, Вы не посмотрели всей специфики построения макета, я обновил код, посмотрите. Как можно футер сделать нормальным?
-
это вторая моя верстка, не удивляйтесь! ))
-
После почти сделанной верстки не получается прикрутить футер. Может быть я первоначально не правильно все верстал? Но переделывать жалко как-то. Футер должен быть на некотором расстоянии от контента, на всю ширину окна браузера. Прошу помощи http://prodpak.ru/ooo/
-
Нужно ли верстальщику изучать JavaScript или можно обойтись JQuery?
Delat replied to vit_master's topic in Flame
интересно, а есть на этом форуме кто-то из front end developerОВ ? Вот пусть она или он расскажет сколько дней учил! -
иногда того, что очевидно не касаюсь, а начинаю искать проблему где-то более "глубоко". И в самом деле убрал паддинг, а в теге <p> паддинг наоборот прописал и всё стало как надо. Спасибо!
-
спасибо, да только через этот сервис проверял :-) текст также выходит за границу, не пойму в чем может быть причина. DIV присвоил table-cell, задал padding:2% - все эти свойства IE8 поддерживает.
-
Вылезающий текст я обнаружил через программу IETester. Если убрать градиент в условных комментариях, то тоже ничего не меняется. А в чем разница между режимом браузера и документа? Если изменить режим браузера на IE8 то все нормально отображается, а если ещё и изменить режим документа на IE8, то проблема снова появляется.
-
без этого что ли? <!--[if lt IE 9]> <style type="text/css"> .header li { filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aaD8E6B2', endColorstr='#aaD8E6B2'); } .topfooter { filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#aa000000', endColorstr='#aa000000'); } </style> <![endif]-->
-
Не могу найти ошибку, так выглядит в IE8: http://prodpak.ru/ooo/
-
Плавно выезжающие подпункты меню, свойство transition
Delat replied to Delat's question in HTML Coding
уже сделал при помощи Accordion Widget -
А ещё может быть вы долго верстали?
-
а, теперь понятно, спасибо за ссылку
-
На сайте первого канала РФ можно увидеть два подключения фавиконки: <link rel="icon" href="favicon.ico" type="image/x-icon" /> <link rel="shortcut icon" href="favicon.ico" type="image/x-icon" /> На некоторых сайтах используют разную конструкцию, а здесь и вовсе две. Что означают значения свойств, какие из них обязательные и как правильно писать в HTML5?
-
Плавно выезжающие подпункты меню, свойство transition
Delat replied to Delat's question in HTML Coding
Я ориентируюсь вот на этот пример http://www.script-tutorials.com/css3-onclick-vertical-metal-menu/ просто скопировать - тогда не смогу создавать нечто похожее самостоятельно. -
Каким образом мы скрываем? Мы лишь не даем временно отобразить на поверхности то что скрыто. В теле документа к примеру, если это .html - "скрытый" текст присутствует. Ведь в конечном итоге мы не прячем подменю или текст, а говорим пользователю (и поисковому роботу), нажми сюда и увидишь.
-
Если кто сталкивался, подскажите как сделать чтобы подпункты меню выезжали плавно. http://jsfiddle.net/5zHKg/
-
Часто встречал в примерах, как кто-то делая выпадающие подпункты меню или целый текст скрывал их свойством display: none;, а потом через псевдоклассы выводил по наведению курсора на объект или клику. Я и сам так стал делать. В книге Эрика Мейра где-то упоминалось, что значение none свойства дисплей используется только в одном случае(!) От сюда вопросы. Семантически это верно? Как относятся поисковики к индексации подобных структур? Хороший ли это тон, может лучше z-index?
-
Так и есть. Только в своей верстке я писал также, иначе в IE 9 новые теги не распознавались им. ТС: заметил что стиль шрифта в вашей верстке кое-где отличается от макетного. Мне кажется вы сделали хорошо, жаль что не пояснили причину. Если и есть косяки, то они поправимы и за короткое время с опытом исчезнут.
-
(*с этим разобрался) если включить в FireFox Веб-разработка-Адаптивный дизайн и изменить разрешение на 1920*900 то всё будет приближено к левому краю, а если изменить разрешение на 1024*768 тогда один элемент сходит вниз. Можно поставить минимальную ширину, но ведь тогда появится горизонтальная полоса прокрутки.
-
Как сделать чтобы содержимое DIV вложенного в div.topfooter всегда оставалось по центру в не зависимости от разрешения монитора? http://prodpak.ru/style/
-
дело в том, что цвета на моем ноутбуке выглядят по мне так нормально, но вот час назад смотрел сайт на другом мониторе, то тоже заметил насыщенную яркость, даже не знаю, как быть. проблема с тенью мной была замечена только в Opera в том то и дело, что читал, все вроде понятно, а сообразить почему в результате после изменения значения свойства форматирование изменилось как надо - так и не получилось. Может быть надо отдохнуть.