Delat

Как делаются такие эффекты, когда при вводе текста placeholder не исчезает, а уменьшается и перемещается в угол. Вот пример с placeholder (слово "email") сместилось при вводе почтового ящика.

вот это интересно, можете пояснить на примере? У меня объемлющий блок в котором находится кнопка, имеет ширину 375px. Как высчитать пропорции для border-radius в %?

Как сверстать блок с закруглёнными краями и градиентным border? На примере кнопки, я сверстал используя не стандартный подход, а есть ли более правильный семантически корректный подход в решении таких задач? Не нравится что кнопка вышла фиксированного размера. Много CSS-свойств. *, *::before, *::after { box-sizing: border-box; } body { background: #050B1F; } /* Верхний слой */ #button-continue { margin-top: 46px; width: 331px; height: 54px; border: 3px solid transparent; border-radius: 56px; background-color: rgba(11, 27, 55, 1); position:relative; cursor:pointer; } /* нижний слой (Градиент) */ #button-continue::after { content: ""; width:337px; height:60px; position:absolute; z-index:-5; top:-6px; left:-6px; border-radius: 56px; background-image: radial-gradient(circle closest-side at 40% -40px, rgba(255, 255, 255, 1), rgba(31, 119, 200, 1) 100px); } .button-continue__text { text-transform: uppercase; font-size: 0.875em; color: #99CEFF; font-weight: 400; } .button-continue__text::after { content: url('img/icon-continue.svg'); position: relative; top: 3px; left: 10px; } <button id="button-continue"> <span class="button-continue__text">Continue</span> </button> Должно получиться вот так, но получилось не так как хотелось бы:

Да. А почему сомнения?

Сайт открывается с протоколом http и https. Редирект .htaccess есть. В чём причина? Options +FollowSymLinks Options -Indexes RewriteEngine on RewriteCond %{HTTP_HOST} ^www.site.ru$ [NC] RewriteRule ^(.*)$ https://site.ru/$1 [L,R=301] #apache2ctl -M && sudo a2enmod expires && sudo service apache2 restart (to enable mod_expires on ubuntu) <IfModule mod_expires.c> ExpiresActive On ExpiresDefault "access 7 days" ExpiresByType image/gif "access plus 1 year" ExpiresByType image/jpeg "access plus 1 year" ExpiresByType image/png "access plus 1 year" ExpiresByType image/jpg "access plus 1 year" ExpiresByType image/x-icon "access 1 year" ExpiresByType application/x-shockwave-flash "access 1 year" ExpiresByType application/javascript "access 1 year" ExpiresByType application/x-javascript "access 1 year" ExpiresByType text/css "access 1 year" ExpiresByType text/html "access 1 year" </IfModule> RewriteRule ^(.*)\.tpl$ [R=404] RewriteRule ^(.*)backups(.*)\.zip$ [R=404] RewriteCond $1 !^(phpinfo.php|index\.php|user_guide|uploads/.*|d35541edc391\.html|google2c3b3b2d324f8a50\.html|google33a3de9f6cc4a710\.html|google5ba5ce5ac24927ec\.html|favicon\.ico|article\.php|simple_html_dom\.php|docs|favicon\.png|captcha/.*|application/modules/.*/templates|application/modules/.*/assets/js|application/modules/.*/assets/css|application/modules/.*/assets/images|CHANGELOG.xml|templates|js|robots\.txt|movefiles\.php) RewriteRule ^(.*)$ /index.php/$1 [L] #################################### # or # RewriteRule ^(.+)$ index.php?$1 [L] # or # RewriteRule ^(.*)$ /index.php?/$1 [L,QSA] AddDefaultCharset utf-8 AddType 'text/html; charset=utf-8' .html .htm .shtml ## USER IP BANNING <Limit GET POST> order allow,deny deny from 85.198.123.230 ## deny from 80.80.108.77 ## deny from 80.80.98.158 allow from all </Limit>

Нет. Слик пробовал установить, но были большие проблемы с версткой на всем шаблоне. Спасибо, скрипт не корректно работает или я что-то делаю не правильно. При разрешении меньше 768px цветные блоки располагаются вертикально, как только начинаю передвигать окно на уменьшение, то образуются слайд. То есть слайд при загрузке с разрешением меньше 768px по умолчанию не загружается. Ммм, не совсем понятно, в каких случаях это пригодится? Если кто-то заходит на сайт со стандартного компьютера - то видит горизонтальный упорядоченный список, если с мобильного то слайдер.

А я на вас надеялся(( Мне почему-то только два человека на форуме отвечают.

По видимому без вариантов, придется дорабатывать скрипт или отказаться от идеи. У разработчика (из справки) нет решений в таких случаях. Вообще очень много возникает вопросов, где твои возможности упираются в границы твоих познаний и в таком случае необходима чья-то помощь по доработке скриптов, верстки и пр. И это только у меня, а есть ещё десятки тысяч. На месте администрации, я бы подумал как можно создать раздел на форуме, где за n- сумму люди могли помогать другим в решении их проблем в рамках существующих тем форума. Что-то по типу fiverr.com

https://jsfiddle.net/Delat/L9z4hhrx/15/ До 768px скрипт работает как слайдер и это правильно. Но вот не получается запретить с помощью стилей срабатывание стиля при разрешении 768px и выше. Может быть это в принципе нельзя сделать в стилях? Необходимо чтобы при разрешении свыше 768px (включительно), блоки <li> были списком расположенные по горизонтали.

Подскажите простой, а можно и не простой скрипт спойлера, где при клике и раскрытии черный плюс становится минусом.

<div class="imgPages col-es_12 clearfix"> <a href="assets/template/flexible/img/ballu/bravo.jpg"> <img src="assets/template/flexible/img/ballu/small/bravo.jpg" alt="Ballu Bravo внутренний блок"> </a> <a href="assets/template/flexible/img/ballu/bravo-outdoor.jpg"> <img src="assets/template/flexible/img/ballu/small/bravo-outdoor.jpg"> </a> <a href="assets/template/flexible/img/ballu/bravo-pult.jpg"> <img src="assets/template/flexible/img/ballu/small/bravo-pult.jpg" alt="Ballu Bravo ИК-пульт"> </a> </div> Есть вот такой блок с изображениями расположенными в горизонтальной плоскости. Как сделать чтобы при уменьшении окна, если не помещаются изображения, то они скрывались кроме первого активного изображения? И по бокам появлялись стрелочки для просмотра остальных.

Хорошие примеры. Но там нет примера как по событию, а именно при прокрутке страницы вниз, анимировать элементы.

На сайте https://pages.github.com/ по мере продвижения скролла вниз, видно как информационные блоки плавно появляются, как-будто выплывают. Как называются такие эффекты? Где можно подробно почитать, чтобы научиться их делать самостоятельно. А может быть есть уже готовые, которые не сложно кастомизировать?

Весьма искусно. Теперь работает) За ссылку спасибо! Эх, если бы я её раньше увидел. а где лучше выучить jQuery?

Нашел причину почему не работает в шаблоне. Если убрать этот код то ваш скрипт работает на сайте: jQuery(document).ready(function($) { $(".category-content").hide(); $(".category li:first a").addClass("active-link").show(); $(".category-content:first").show(); $(".category li a").click(function() { $(".category li a").removeClass("active-link a"); $(this).addClass("active-link"); $(".category-content").hide(); var activeTab = $(this).attr("href"); $(activeTab).fadeIn(); return false; }); }); Подскажите пожалуйста, что изменить в вашем коде чтобы он заработал вместе с этим?