Jump to content
  • 0

Анимация на CSS3


PavelTkachev
 Share

Question

Я читал упоминания о том, что на CSS3 можно без JavaScript добиться открытия и закрытия блоков сайта. Я хочу разместить в скрытом блоке форму обратной связи и сделать кнопку, по нажатию на которой эта форма будет появляться, а кнопка исчезать. Можно ли это сделать с помощью CSS3? И если да, то как?

Link to comment
Share on other sites

15 answers to this question

Recommended Posts

  • 0

Это можно сделать если не интересуют ИЕ ниже 9 версии. Нужно использовать чекбокс и псевдокласс :checked

 

 

Спасибо, начал изучать. А можно ли сделать так, чтобы для тех браузеров у которых это работает блок был скрыт, а для остальных открыт? Но без использования JavaScript.

учитесь гуглить

Не буду пользоваться западными технологиями.

 

по сути лучше подключить jquery и написать одну строчку кода

 

Не лучше, так как ради элементарной задачи я буду таскать с сайтом лишние килобайты. Я даже простой JavaScript писать не хочу.

Можно. Руками.

 

http://codepen.io/hans/pen/EFaGk

http://codepen.io/cihadturhan/pen/KIJdD

 

ну и там много примеров еще бывало, искать надо.

 

 

Спасибо. Начал изучать.

animate.css

 

Да, но там слишком много всего. Оставил на потом.

Link to comment
Share on other sites

  • 0
jQuery лишние 70кб ? Хоть посмотрите сколько она с cdn грузится

Мало ли в проекте используется jquery, также jquery можно собрать под свои нужды, ну на крайняк можно просто написать пару строк js кода.
Link to comment
Share on other sites

  • 0
Не буду пользоваться западными технологиями
яндекс.
Спасибо, начал изучать. А можно ли сделать так, чтобы для тех браузеров у которых это работает блок был скрыт, а для остальных открыт? Но без использования JavaScript
ie можно и через эти классы контролировать
<!DOCTYPE html><!--[if lt IE 7 ]> <html lang="en" class="no-js ie6 lt-ie9 lt-ie8 lt-ie7"> <![endif]--><!--[if IE 7 ]> <html lang="en" class="no-js ie7 lt-ie9 lt-ie8"> <![endif]--><!--[if IE 8 ]> <html lang="en" class="no-js ie8 lt-ie9"> <![endif]--><!--[if IE 9 ]> <html lang="en" class="no-js ie9"> <![endif]--><!--[if (gt IE 9)|!(IE)]><!--><html lang="en" class="no-js"><!--<![endif]-->
ради элементарной задачи
если бы она была элементарной, не было бы и вопроса.
Да, но там слишком много всего.
уберите лишнее. 
Link to comment
Share on other sites

  • 0

 

jQuery лишние 70кб ? Хоть посмотрите сколько она с cdn грузится

Мало ли в проекте используется jquery, также jquery можно собрать под свои нужды, ну на крайняк можно просто написать пару строк js кода.

 

У меня сейчас сайтик получился адаптивный с кучей плагинов и картинок 350кб, Yslow дает 91%, я еще толком

даже не оптимизировал. Не понимаю людей экономящих на jQuery.

Link to comment
Share on other sites

  • 0
Не понимаю людей экономящих на jQuery.

 

В моём случае это просто угода протекционизму. Хочу минимум килобайт, потому даже чистый JavaScript не хочу.

 

А так, конечно, с CDN качать Jquery. У большинства посетителей оно тогда вообще закачиваться не будет.


ie можно и через эти классы контролировать

 

Могут ли подобные директивы быть внутри CSS файла?

 

если бы она была элементарной, не было бы и вопроса.

 

Как раз таки элементарное и вызывает массу вопросов, так как можешь его целиком удержать в голове. А сложное вопросов обычно не вызывает, так как в голову не помещается.

Link to comment
Share on other sites

  • 0
У большинства посетителей оно тогда вообще закачиваться не будет.
с чего вы взяли?
Могут ли подобные директивы быть внутри CSS файла?
что? нет.
В моём случае это просто угода протекционизму
здравый смысл тоже надо подключать)  
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy