单击滑入/滑出div

时间:2017-08-19 17:12:38

标签: jquery css3

我有一个内容div,根据需要打开和关闭,但我无法让内容div从底部滑入或滑出。我尝试使用CSS但我认为它的固定位置让我感到悲伤。默认情况下,它应该是hiddin但默认显示

private final String
$(".livechat-button").click(function() {
    $("#newpost").toggle();
});
.livechat-button {
	display: block;
	position: fixed;
	bottom: 0px;
	right: 0px;
	border-top: solid 1px #333333;
	border-left: solid 1px #333333;
	width: 180px;
	height: 50px;
	background-color: rgba(0,0,0,1.00);
	text-align: center;
	padding-top: 15px;
	color: #fff;
	cursor: pointer;
}

.newcontent {
	display: block;
	position: fixed;
	bottom: 0px;
	right: 0px;
	border-top: solid 1px #333333;
	border-left: solid 1px #333333;
	width: 300px;
	height: 450px;
	background-color: rgba(71,227,255,1.00);
	text-align: center;
	font-size: 13px;
	color: #000;
	padding-top: 5px;
}

1 个答案:

答案 0 :(得分:2)

使用此工作代码。

$(".livechat-button").click(function() {
    $("#newpost").slideToggle();
});
});

以下css

.newcontent {
    display: none;  
    position: fixed;
    bottom: 0px;
    right: 0px;
    border-top: solid 1px #333333;
    border-left: solid 1px #333333;
    width: 300px;
    height: 450px;
    background-color: rgba(71,227,255,1.00);
    text-align: center;
    font-size: 13px;
    color: #000;
    padding-top: 5px;
}