bootstrap-3更改导航栏折叠的transition-property

请问任何人都可以解释如何更改标准bootstrap-3导航栏中collapsing元素的transition-property？我想过渡到是这样的，但与汉堡菜单上单击时“顶”属性：http://jsfiddle.net/2vLjU/1/bootstrap-3更改导航栏折叠的transition-property

<div class="wrapper"> 
    <img id="slide" src="http://lorempixel.com/output/cats-q-c-100-100-4.jpg" /> 
</div> 

.wrapper { 
    position: relative; 
    overflow: hidden; 
    width: 100px; 
    height: 100px; 
    border: 1px solid black; 
} 

#slide { 
    position: absolute; 
    left: -100px; 
    width: 100px; 
    height: 100px; 
    background: blue; 
    transition: 1s; 
} 

.wrapper:hover #slide { 
    transition: 1s; 
    left: 0; 
}

来源

2017-08-04 Kaori

请看下面的例子中我在这里提出： http://jsfiddle.net/f5jzo25t/

我用CSS3 '：目标'与'a'元素配合得很好。

img:target { 
    left: 0; 
    transition: 1s; 
}

你可以阅读更多关于它： https://www.w3schools.com/cssref/sel_target.asp

希望这将有助于你

来源

2017-08-05 00:16:22 TalGabay

谢谢！但我的意思是如何实现这个引导，因为它似乎有它自己的折叠元素的JavaScript代码，我有理解它的问题。 – Kaori

我发现这个：https：//www.bootply.com/dragan/3AZB0lGFyt。也许这会帮助你，在这个例子中，你只有jQuery的引导。 – TalGabay

似乎不是它再次。我认为它与.collapsing课程有关。但是当我改变它时，由于某种原因它不起作用。 '.navbar-collapse.collapsing { position：relative; top：-100px; 溢出：隐藏; transition-property：top; transition-duration：0.1s; transition-timing-function：ease; }' – Kaori

bootstrap-3更改导航栏折叠的transition-property

回答

相关问题