necro
User-
Posts
84 -
Joined
-
Last visited
necro's Achievements
Explorer (1/14)
1
Reputation
-
Это я все читал, не то. Чтобы бордер просто был, а не заливка, таким макаром не получится. Ну или получится, но я слишком слабенький, а таких примеров там нет) http://jsfiddle.net/abarykin/Y4r9X/ Тут и реализация проще и работает как надо
-
Как все таки жизнь облегчают правильные запросы. На второй же странице нашел то. что нужно, до этого весь гугл перерыл, но ничего толком не нашел. Спасибо)
-
Добрый день. Подскажите, как можно заверстать вот такие штуки? Без картинок. http://prntscr.com/anvzcp http://prntscr.com/anvzgx http://prntscr.com/anvzpg Спасибо!
-
Не могу статью найти, но если это норм вариант, то можно ли немного объяснить как оно работает? И еще, все ок если нет конкретных требований, а если мне четко стоит там столько пикселей, тут столько, в этом способе, как я понимаю, какое-то процентное отношение к высоте\ширине окна
-
Это с размером шрифта, а отступы? И я читал что все эти vw vh и тд, так себе варианты, есть куча минусов
-
Моя первая верстка. Через тернии к звездам
necro replied to FilippovAM's topic in Discussion of works
FilippovAM, День добрый.А можно ли у вас попросить этот макет, чтобы потренироваться? Выкладывать никуда не буду, ну разве что сюда, для критики. А то в сети маловато хороших макетов, на которых можно тренироваться адаптивной верстке, а этот весьма неплох и интересен) Буду вам очень благодарен. email d9idbka@gmail.com- 17 replies
-
- верстка начало
- пусть верстальщика
- (and 6 more)
-
Доброго времени суток. Начал по тиху разбираться с адаптивной версткой и возник вопрос. Нашел в сети простой шаблон для тренировки и сижу делаю. Так вот, если блок, в нем текст. На 1024 паддинги к примеру : 100px 200px 50px 20px; на 320 уже будет 20px 50px 12px 5px. Шрифт тоже становится меньше, сидел долго думал как правильно сделать, гуглил читал, в итоге все равно сделал через @media. Вздохнул с облегчением, спустился к следующему блоку, а там почти такакя же история, сижу опять прописываю кучу @media. И возник вопрос, правильно ли это? Есть ли какой-то способ менять отступы и размер шрифта в зависимости от разрешения или вариант с media считается нормальным? Вот скрин на 1024px и 320px, чтобы было понятно о чем речь, заранее благодарен за объяснения.
-
День добрый, есть файл main.tpl в нем прописан код всплывающего окна, которое открывается при загрузке любой странице на сайта. В этом окне есть форма, при отправке данных происходит перезагрузка страницы и окно всплывает опять, нужно было сделать так, чтобы после отправки окно больше не всплывалась. Сделал это так: Вот форма <form method="POST" action="send.php" class="popupForm"> <input type="text" name="name" class="name" value="Имя" onfocus="if (this.value == 'Имя') {this.value = '';}" onblur="if (this.value == '') {this.value ='Имя';}"/> <input type="text" name="phone" class="number"value="Номер" onfocus="if (this.value == 'Номер') {this.value = '';}" onblur="if (this.value == '') {this.value ='Номер';}"/> <input type="submit" class="btn4" value="Получи свой сертификат" name="form_submit" style="margin-top:10px;" onclick="document.getElementById('parent_popup').style.display='none';"> </form> <a class="close" title="Закрыть" onclick="document.getElementById('parent_popup').style.display='none';">X</a> Вот обработка формы: <? session_start(); $_SESSION['form_submit'] = 1; $name=$_POST["name"]; $phone=$_POST["phone"]; /*if (empty($_POST['phone'])) { echo "<center><b>Не указан номер телефона !!!<p>"; echo "<a href=index.html> Нажмите, чтобы вернуться и ввести номер.</a>"; exit; }*/ $to = "123@gmail.com"; $subject = "Здравствуйте, Вам пришла заявка на получение сертифика с сайта "; $message = "Добрый день, пришла новая заявка от \n"; if (isset($_POST['name'])) { $message .= "Имя:".$_POST['name']." \n"; } if (isset($_POST['phone'])) { $message .= "Телефон:".$_POST['phone']." \n"; } mail ($to,$subject,$message) or print "Не можем отправить сообщение, попробуйте позже!!!"; echo "<meta http-equiv='Refresh' content='0; URL=index.html'>"; exit; Вот проверка <? if (!isset($_SESSION['form_submit']) || $_SESSION['form_submit'] != 1) { ?> <script type="text/javascript"> var delay_popup = 5000; setTimeout("document.getElementById('parent_popup').style.display='block'", delay_popup); </script><?}?> делал var_dump($_SESSION) передает - ["form_submit"]=> int(1) Но все равно, форма выводится, мб кто подскажет, где косяк.
-
Дело не в ид, я тоже думал, копировал 6 раз скрипт и присваивал разные айдишники) тоже самое получается, работает только на первом слайде. А с дата, как писать? Или дайте ссылку, де почитать, попробую сделать.
-
Добрый день, подключил карусель и добавил менюху, посмотреть можно тут: http://necro.p.ht/afrika-news.org/ Смысл вот в чем, наводишь на пункт меню, картинка меняется, все работает, но только на первом слайде, начиная со второго вроде как и работать должно, но ничего не меняется, картинка остается той дже, когда меню было мень и между картинкой и меню было место, начиная со второго слайда, вторая картинка появлялась после первой, до меню, вернее кусок который влазил в этот промежуток. Вопрос как сделать, чтобы картинка менялась на всех слайдах при наведении или мб кто-то знает уже готовый такой слайдер где есть. Вот код слайдера, если что: <div id="example"> <div id="slides"> <div class="slides_container"> <div class="slide"> <img src="bigNewsImage.jpg" id="img"> <ul> <li onmouseover="show_img(1);" onmouseout="show_img(0);"><a href="#">Евросоюз решил дать Мали военную поддержку</a></li> <li onmouseover="show_img(0);" onmouseout="show_img(0);"><a href="#">Мозамбик использует крыс для борьбы с туберкулезом</a></li> <li onmouseover="show_img(1);" onmouseout="show_img(0);"><a href="#">Бизнес и бездомные в Замбии</a></li> <li onmouseover="show_img(0);" onmouseout="show_img(0);"><a href="#">В Тунисе после беспорядков сняли губернатора</a></li> </ul> </div> <div class="slide"> <img src="bigNewsImage.jpg" id="img"> <ul> <li onmouseover="show_img(1);" onmouseout="show_img(0);"><a href="#">Евросоюз решил дать Мали военную поддержку</a></li> <li onmouseover="show_img(0);" onmouseout="show_img(0);"><a href="#">Мозамбик использует крыс для борьбы с туберкулезом</a></li> <li onmouseover="show_img(1);" onmouseout="show_img(0);"><a href="#">Бизнес и бездомные в Замбии</a></li> <li onmouseover="show_img(0);" onmouseout="show_img(0);"><a href="#">В Тунисе после беспорядков сняли губернатора</a></li> </ul> </div> <div class="slide"> <img src="bigNewsImage.jpg" id="img"> <ul> <li onmouseover="show_img(1);" onmouseout="show_img(0);"><a href="#">Евросоюз решил дать Мали военную поддержку</a></li> <li onmouseover="show_img(0);" onmouseout="show_img(0);"><a href="#">Мозамбик использует крыс для борьбы с туберкулезом</a></li> <li onmouseover="show_img(1);" onmouseout="show_img(0);"><a href="#">Бизнес и бездомные в Замбии</a></li> <li onmouseover="show_img(0);" onmouseout="show_img(0);"><a href="#">В Тунисе после беспорядков сняли губернатора</a></li> </ul> </div> <div class="slide"> <img src="bigNewsImage.jpg" id="img"> <ul> <li onmouseover="show_img(1);" onmouseout="show_img(0);"><a href="#">Евросоюз решил дать Мали военную поддержку</a></li> <li onmouseover="show_img(0);" onmouseout="show_img(0);"><a href="#">Мозамбик использует крыс для борьбы с туберкулезом</a></li> <li onmouseover="show_img(1);" onmouseout="show_img(0);"><a href="#">Бизнес и бездомные в Замбии</a></li> <li onmouseover="show_img(0);" onmouseout="show_img(0);"><a href="#">В Тунисе после беспорядков сняли губернатора</a></li> </ul> </div> <div class="slide"> <img src="bigNewsImage.jpg" id="img"> <ul> <li onmouseover="show_img(1);" onmouseout="show_img(0);"><a href="#">Евросоюз решил дать Мали военную поддержку</a></li> <li onmouseover="show_img(0);" onmouseout="show_img(0);"><a href="#">Мозамбик использует крыс для борьбы с туберкулезом</a></li> <li onmouseover="show_img(1);" onmouseout="show_img(0);"><a href="#">Бизнес и бездомные в Замбии</a></li> <li onmouseover="show_img(0);" onmouseout="show_img(0);"><a href="#">В Тунисе после беспорядков сняли губернатора</a></li> </ul> </div> <div class="slide"> <img src="bigNewsImage.jpg" id="img"> <ul> <li onmouseover="show_img(1);" onmouseout="show_img(0);"><a href="#">Евросоюз решил дать Мали военную поддержку</a></li> <li onmouseover="show_img(0);" onmouseout="show_img(0);"><a href="#">Мозамбик использует крыс для борьбы с туберкулезом</a></li> <li onmouseover="show_img(1);" onmouseout="show_img(0);"><a href="#">Бизнес и бездомные в Замбии</a></li> <li onmouseover="show_img(0);" onmouseout="show_img(0);"><a href="#">В Тунисе после беспорядков сняли губернатора</a></li> </ul> </div> </div> </div> </div> Вот код js <script> var imgs = new Array("bigNewsImage.jpg", "bigNewsImage1.jpg"); function show_img(a) { var obj = document.getElementById("img"); obj.src = imgs[a]; } </script> Буду очень благодарен, если кто подскажет, как сделать. Спасибо.
-
да я уже понял, разобрался.
-
Добрый день. Подскажите пожалуйста, есть блок. <div class="switchForm"> <div class="switch"><p></p><span>Безмятежность</span></div> </div> Это переключатель, когда нажимаешь на него, с помощью js добавляется класс со своими стилями, якобы он включен $(document).ready(function(){ $(".switch p").click(function () { $(".switch").toggleClass("switchOn"); }); }); Вопрос в следующем, есть файл send.php в который я передаю значения из разных форм, но также мне нужно передавать какое-либо значение, если вышеописанный переключатель находится во включенном состоянии, т.е. когда ему присвоен класс switchOn, подскажите пожалуйста,как это реализовать.
-
В общем вопрос такой, вернее их два. Первый, сделал 2 ползунка, отредактировал стили, в итоге получилось вот что: http://clip2net.com/s/4WbvIo Все хорошо, все ползает, дальше задача была такая, чтобы когда ползунок двигался, всплывал блок с текстом и отображал сколько процентов сейчас, ну в общем как-то так http://clip2net.com/s/4WbDqA Вот тут и начались проблемы. Во втором блоке нужно, чтобы проценты свои считало, а я как бы не делал, максимум добивался того, что считает одинаково для двух ползунков, те изначально первый на 120, второй на 0, на обоих показывает 120, двигаю первый допустим на сотку, втрой стоит на нуле, но показывает сотку, двигаю второй, первый принимает значение второго, как сделать, чтобы считало для каждого по-своему. вот код <script> $(function(){ $("#slider").slider(); }); $(function() { $(".slider-range").slider({ range: "min", min: 0, max: 150, value: 120, slide: function( event, ui ) { $( "#amount" ).val( ui.value+"%" ); } }); $( "#amount" ).val($( ".slider-range" ).slider( "value" )+"%"); }); $(document).ready(function(){ $(".ui-slider-handle").hover(function () { $(".123", this).toggle(); }); }); </script> И в jse скрипта этого тоже вставлял свои куски handle = "<a class='ui-slider-handle ui-state-default ui-corner-all' href='#'><div class='123'><input type='text' id='amount' style='border:0; color:#685e5b; font-weight:bold; font:16px OpenSans-Light, sans-serif; background:#f9f9f9; width:60px; height:20px; margin:25px 0 0 50px;' /></div></a>" И второй вопрос. Мне нужно сделать ещё несколько ползунков, но уже с другим стилем, но если добавлю ещё, то все они будут такие же как и эти два, а мне нужны абсолютно другие, как это реализовать. Очень надеюсь на вашу помощь, не особо силен в jse, второй день ломаю голову, ничего не выходит. Спасибо.
-
Нужен хелп, в jse не особо разбираюсь, брал готовый скрипт карусели, где картинки меняются по нажатию на кнопку, сечас сказали доработать и сделать так, чтоб со временем картинки ещё и сами прокручивались, мб поможет кто? вот скрипт: <script type="text/javascript"> $(document).ready(function(){ $(".b-carousel-button-right").click(function(){ // при клике на правую кнопку запускаем следующую функцию: $(".h-carousel-items").animate({left: "-222px"}, 200); // производим анимацию: блок с набором картинок уедет влево на 222 пикселя (это ширина одного прокручиваемого элемента) за 200 милисекунд. setTimeout(function () { // устанавливаем задержку времени перед выполнением следующих функций. Задержка нужна, т.к. эти ффункции должны запуститься только после завершения анимации. $(".h-carousel-items .b-carousel-block").eq(0).clone().appendTo(".h-carousel-items"); // выбираем первый элемент, создаём его копию и помещаем в конец карусели $(".h-carousel-items .b-carousel-block").eq(0).remove(); // удаляем первый элемент карусели $(".h-carousel-items").css({"left":"0px"}); // возвращаем исходное смещение набора набора элементов карусели }, 300); }); $(".b-carousel-button-left").click(function(){ // при клике на левую кнопку выполняем следующую функцию: $(".h-carousel-items .b-carousel-block").eq(-1).clone().prependTo(".h-carousel-items"); // выбираем последний элемент набора, создаём его копию и помещаем в начало набора $(".h-carousel-items").css({"left":"-222px"}); // устанавливаем смещение набора -222px $(".h-carousel-items").animate({left: "0px"}, 200); // за 200 милисекунд набор элементов плавно переместится в исходную нулевую точку $(".h-carousel-items .b-carousel-block").eq(-1).remove(); // выбираем последний элемент карусели и удаляем его }); }); </script>
-
Да именно так и нужно было, сделал так же как и вы сказали, но мне было больше интересно можно ли вставить такой блок именно в блок с фиксированной шириной)