Bootstrap – bbird.me http://bbird.me WordPress quick tips Wed, 08 Aug 2018 16:39:07 +0000 en-US hourly 1 https://wordpress.org/?v=4.9.8 Adding CSS transition on Bootstrap drop-down menu http://bbird.me/adding-css-transition-on-bootstrap-drop-down-menu/ http://bbird.me/adding-css-transition-on-bootstrap-drop-down-menu/#comments Fri, 15 May 2015 19:38:05 +0000 http://bbird.me/?p=126 If you implemented bootstrap into your WordPress template and want to add CSS transitions to drop-down menu, you can use

Post Adding CSS transition on Bootstrap drop-down menu je prvi puta viđen na bbird.me.

]]> If you implemented bootstrap into your WordPress template and want to add CSS transitions to drop-down menu, you can use the following code:

@media (min-width: 768px) {
.dropdown .dropdown-menu{
    display: block; 
  opacity:0;
-webkit-transition: all 200ms ease-in;
-moz-transition: all 200ms ease-in;
-ms-transition: all 200ms ease-in;
-o-transition: all 200ms ease-in;
transition: all 200ms ease-in;
}
.dropdown:hover .dropdown-menu {
    display: block;
    opacity: 1;
}
}

Why media queries? Because you don’t want display:block on hover on the mobile menu (as the hover used for this would double the submenu). As for CSS transitions, you can generate them using any of the online generators, such as this one.

Post Adding CSS transition on Bootstrap drop-down menu je prvi puta viđen na bbird.me.

]]> http://bbird.me/adding-css-transition-on-bootstrap-drop-down-menu/feed/ 4