如何使模态div出现并通过javascript消失

时间：2015-02-11 11:43:18

标签： javascript html html5 css3 modal-dialog

这是应该使模态div出现和消失的js代码，默认情况下使用上述id隐藏模态div（pr_ball0）

＆＃13;
＆＃13; 
function setStile(){
		document.getElementById('pr_ball0').style.visibility="visible";
		}	
	function hide(){
		document.getElementById("myHide1").style.visibility="hidden";
	}
＆＃13; 
this is the css code which make the  balls work 
/* [Object] Modal
 * =============================== */
 @import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz);
.ball {
  opacity: 0;
  visibility: hidden;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  text-align: center;
  background: rgba(0,0,0, .9);
  transition: opacity .25s ease;
  padding: 40px;
}

.ball_bg {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  cursor: pointer;
}

.ball-state {
  display: none;
}

.ball-state:checked + .ball {
  opacity: 1;
  visibility: visible;
}

.modal-state:checked + .ball .pr_inner {
  top: 0;
}
.pr_ball
{
  transition: top .25s ease;
  position: absolute;
  width: 50%;
  height: 50%;
  top: -2%;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 10%;
  border-radius: 100%;
}
#pr_ball0 {
  
  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(ellipse farthest-corner at center, #F2E357 0%, #F2EB1B 100%);
  visibility: hidden;
}

#pr_ball1 {
  
  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(circle farthest-corner at center, #D6D696 0%, #EFEFB1 100%);
 
}

#pr_ball2 {

  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(circle farthest-corner at center, #D6D262 0%, #8CCF59 100%);
}

#pr_ball3 {
  
  
  
  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(circle farthest-corner at center, #B3F2AE 0%, #DBF2C2 100%);
 
}

#pr_ball4 {
  
  

  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(ellipse farthest-corner at center, #D69C15 0%, #F7E334 100%);
 
}

#pr_ball5 {
  
  
  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(ellipse farthest-corner at center, #F2816A 0%, #F2B28C 100%);
 
}

#pr_ball6 {
  
  
  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(ellipse farthest-corner at center, #F2CD8C 0%, #EBF2C6 100%);

}

#pr_ball7 {
  
  
  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(ellipse farthest-corner at center, #D6D2D3 0%, #BAB3BA 100%);
 
}

#pr_ball8 {
  
  
  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(ellipse farthest-corner at center, #C7F2EC 0%, #DAF1F2 100%);

}

#pr_ball9 {
  
 
  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(ellipse farthest-corner at center, #D6D2D3 0%, #F7CBCF 100%);

}

#pr_ball10 {
  
  
  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(ellipse farthest-corner at center, #D6D2D3 0%, #D394F7 100%);
  border-radius: 100%;

}

.ball_close {
  position: absolute;
  right: 30%;
  top: 5%;
  width: 40px;
  height: 40px;
  cursor: pointer;
  box-shadow: rgba(233, 25, 25, 1) 10px 10px 10px;
}

.ball_close:after,
.ball_close:before {
  content: '';
  position: absolute;
  width: 2px;
  height: 1.5em;
  background: none repeat scroll 0% 0% rgba(245, 12, 12, 1);
  display: block;
  transform: rotate(45deg);
  left: 50%;
  margin: -3px 0 0 -1px;
  top: 0;
}

.ball_close:hover:after,
.ball_close:hover:before {
  background: #aaa;
}

.ball_close:before {
  transform: rotate(-45deg);
}

@media screen and (max-width: 768px) {
	
  .pr_inner {
    width: 90%;
    height: 90%;
    box-sizing: border-box;
  }
}


/* Other
 * =============================== */
body {
  padding: 	50px;
  text-align: center;
}

.btn:hover{
opacity: 0.5;
}

#pr_btn0 {
cursor: pointer;
position: absolute;
top: 270px;
left: 300px;
width: 150px;
height: 150px;
padding: 30px;
border-radius: 300px;
box-shadow: #cccccc 10px 10px 10px;
background-color: yellow;
}
#pr_btn0:hover{
opacity: 0.4;
}

#pr_btn1 {
cursor: pointer;
position: absolute;
top: 240px;
left: 215px;
width: 70px;
height: 70px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(circle farthest-corner at center, #D6D696 0%, #EFEFB1 100%);
}

#pr_btn2 {
cursor: pointer;
position: absolute;
top: 280px;
left: 130px;
width: 40px;
height: 40px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(circle farthest-corner at center, #D6D262 0%, #8CCF59 100%);
}

#pr_btn3 {
cursor: pointer;
position: absolute;
top: 210px;
left: 10px;
width: 90px;
height: 70px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(circle farthest-corner at center, #B3F2AE 0%, #DBF2C2 100%);
}

#pr_btn4 {
  cursor: pointer;
background: #4c74be;
position: absolute;
top: 390px;
left: 110px;
width: 60px;
height: 60px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #D69C15 0%, #F7E334 100%);
}

#pr_btn5 {
  cursor: pointer;
  position: absolute;
top: 410px;
left: 10px;
width: 60px;
height: 60px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #F2816A 0%, #F2B28C 100%);
}

#pr_btn6 {
  cursor: pointer;
  background: #4c74be;
position: absolute;
top: 400px;
left: 220px;
width: 60px;
height: 60px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #F2CD8C 0%, #EBF2C6 100%);
}

#pr_btn7 {
  cursor: pointer;
 background: #4c74be;
position: absolute;
top: 390px;
left: 435px;
width: 80px;
height: 80px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #D6D2D3 0%, #BAB3BA 100%);
}

#pr_btn8 {
  cursor: pointer;
  background: #4c74be;
position: absolute;
top: 420px;
left: 565px;
width: 70px;
height: 70px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #C7F2EC 0%, #DAF1F2 100%);
}

#pr_btn9 {
  cursor: pointer;
  background: #4c74be;
position: absolute;
top: 345px;
left: 515px;
width: 40px;
height: 40px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #D6D2D3 0%, #F7CBCF 100%);
}

#pr_btn10 {
  cursor: pointer;
 background: #4c74be;
position: absolute;
top: 210px;
left: 515px;
width: 90px;
height: 90px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #D6D2D3 0%, #D394F7 100%);
}

.btn:hover,
.btn:focus {
  background: #2ecc71;
}

.btn:active {
  background: #27ae60;
  box-shadow: 0 1px 2px rgba(0,0,0, .2) inset;
}

.btn--blue {
  background: #2980b9;
}

.btn--blue:hover,
.btn--blue:focus {
  background: #3498db;
}

.btn--blue:active {
  background: #2980b9;
}

p img {
  max-width: 200px;
  height: auto;
  float: left;
  margin: 0 1em 1em 0;
}

#pr_ball7 {
  
  
  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(ellipse farthest-corner at center, #D6D2D3 0%, #BAB3BA 100%);
 
}

#pr_ball8 {
  
  
  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(ellipse farthest-corner at center, #C7F2EC 0%, #DAF1F2 100%);

}

#pr_ball9 {
  
 
  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(ellipse farthest-corner at center, #D6D2D3 0%, #F7CBCF 100%);

}

#pr_ball10 {
  
  
  margin: auto;
  overflow: auto;
  box-shadow: #cccccc 10px 10px 10px;
  background-image: radial-gradient(ellipse farthest-corner at center, #D6D2D3 0%, #D394F7 100%);
  border-radius: 100%;

}

.ball_close {
  position: absolute;
  right: 30%;
  top: 5%;
  width: 40px;
  height: 40px;
  cursor: pointer;
  box-shadow: rgba(233, 25, 25, 1) 10px 10px 10px;
}

.ball_close:after,
.ball_close:before {
  content: '';
  position: absolute;
  width: 2px;
  height: 1.5em;
  background: none repeat scroll 0% 0% rgba(245, 12, 12, 1);
  display: block;
  transform: rotate(45deg);
  left: 50%;
  margin: -3px 0 0 -1px;
  top: 0;
}

.ball_close:hover:after,
.ball_close:hover:before {
  background: #aaa;
}

.ball_close:before {
  transform: rotate(-45deg);
}

@media screen and (max-width: 768px) {
	
  .ball {
    width: 90%;
    height: 90%;
    box-sizing: border-box;
  }
}


/* Other
 * =============================== */
body {
  padding: 	50px;
  text-align: center;
}

.pr_ball:hover{
opacity: 0.5;
}

#pr_btn0 {
cursor: pointer;
position: absolute;
top: 270px;
left: 300px;
width: 150px;
height: 150px;
padding: 30px;
border-radius: 300px;
box-shadow: #cccccc 10px 10px 10px;
background-color: yellow;
}
#pr_btn0:hover{
opacity: 0.4;
}

#pr_btn1 {
cursor: pointer;
position: absolute;
top: 240px;
left: 215px;
width: 70px;
height: 70px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(circle farthest-corner at center, #D6D696 0%, #EFEFB1 100%);
}

#pr_btn2 {
cursor: pointer;
position: absolute;
top: 280px;
left: 130px;
width: 40px;
height: 40px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(circle farthest-corner at center, #D6D262 0%, #8CCF59 100%);
}

#pr_btn3 {
cursor: pointer;
position: absolute;
top: 210px;
left: 10px;
width: 90px;
height: 70px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(circle farthest-corner at center, #B3F2AE 0%, #DBF2C2 100%);
}

#pr_btn4 {
  cursor: pointer;
background: #4c74be;
position: absolute;
top: 390px;
left: 110px;
width: 60px;
height: 60px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #D69C15 0%, #F7E334 100%);
}

#pr_btn5 {
  cursor: pointer;
  position: absolute;
top: 410px;
left: 10px;
width: 60px;
height: 60px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #F2816A 0%, #F2B28C 100%);
}

#pr_btn6 {
  cursor: pointer;
  background: #4c74be;
position: absolute;
top: 400px;
left: 220px;
width: 60px;
height: 60px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #F2CD8C 0%, #EBF2C6 100%);
}

#pr_btn7 {
  cursor: pointer;
 background: #4c74be;
position: absolute;
top: 390px;
left: 435px;
width: 80px;
height: 80px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #D6D2D3 0%, #BAB3BA 100%);
}

#pr_btn8 {
  cursor: pointer;
  background: #4c74be;
position: absolute;
top: 420px;
left: 565px;
width: 70px;
height: 70px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #C7F2EC 0%, #DAF1F2 100%);
}

#pr_btn9 {
  cursor: pointer;
  background: #4c74be;
position: absolute;
top: 345px;
left: 515px;
width: 40px;
height: 40px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #D6D2D3 0%, #F7CBCF 100%);
}

#pr_btn10 {
  cursor: pointer;
 background: #4c74be;
position: absolute;
top: 210px;
left: 515px;
width: 90px;
height: 90px;
padding: 30px;
border-radius: 150px;
box-shadow: #cccccc 10px 10px 10px;
background-image: radial-gradient(ellipse farthest-corner at center, #D6D2D3 0%, #D394F7 100%);
}

.btn:hover,
.btn:focus {
  background: #2ecc71;
}

.btn:active {
  background: #27ae60;
  box-shadow: 0 1px 2px rgba(0,0,0, .2) inset;
}

.btn--blue {
  background: #2980b9;
}

.btn--blue:hover,
.btn--blue:focus {
  background: #3498db;
}

.btn--blue:active {
  background: #2980b9;
}

p img {
  max-width: 200px;
  height: auto;
  float: left;
  margin: 0 1em 1em 0;
}
＆＃13; 
this is the html code which through external css and js is supposed to work

<div id="contenitore">
	<label id="pr_btn0" class="pr_ball" for="modal-0" onclick="setStile()">DIV 0</label>
	<label id="pr_btn1" class="pr_ball" for="modal-1">DIV 1</label>
	<label id="pr_btn2" class="pr_ball" for="modal-2">DIV 2</label>
	<label id="pr_btn3" class="pr_ball" for="modal-3">DIV 3</label>
	<label id="pr_btn4" class="pr_ball" for="modal-4">DIV 4</label>
	<label id="pr_btn5" class="pr_ball" for="modal-5">DIV 5</label>
	<label id="pr_btn6" class="pr_ball" for="modal-6">DIV 6</label>
	<label id="pr_btn7" class="pr_ball" for="modal-7">DIV 7</label>
	<label id="pr_btn8" class="pr_ball" for="modal-8">DIV 8</label>
	<label id="pr_btn9" class="pr_ball" for="modal-9">DIV 9</label>
	<label id="pr_btn10" class="pr_ball" for="modal-10">DIV 10</label>
	</div>

    <input class="ball-state" id="modal-0" type="checkbox" />
	<div class="ball">
	  <label class="ball_bg" for="modal-0"></label>
	  <div id="pr_ball0" class="pr_ball">
		<label id="myHide1" class="ball_close" onclick="hide()" for="modal-0"></label>
		<h2>Caaaats FTW!</h2>
		<p>Aliquam in sagittis nulla. Curabitur euismod diam eget risus venenatis, sed dictum lectus bibendum. Nunc nunc nisi, hendrerit eget nisi id, rhoncus rutrum velit. Nunc vel mauris dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam fringilla quis nisi eget imperdiet.</p>
	  </div>
	</div>
	
	<input class="ball-state" id="modal-1" type="checkbox" />
	<div class="ball">
	  <label class="ball_bg" for="modal-1"></label>
	  <div id="pr_ball1" class="pr_ball">
		<label class="ball_close" for="modal-1"></label>
		<h2>Caaaats FTW!</h2>
		<p>Aliquam in sagittis nulla. Curabitur euismod diam eget risus venenatis, sed dictum lectus bibendum. Nunc nunc nisi, hendrerit eget nisi id, rhoncus rutrum velit. Nunc vel mauris dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam fringilla quis nisi eget imperdiet.</p>
	  </div>
	</div>

	<input class="ball-state" id="modal-2" type="checkbox" />
	<div class="ball">
	  <label class="ball_bg" for="modal-2"></label>
	  <div id="pr_ball2" class="pr_ball">
		<label class="ball_close" for="modal-2"></label>
		<h2>Caaaats FTW!</h2>
		<p>Aliquam in sagittis nulla. Curabitur euismod diam eget risus venenatis, sed dictum lectus bibendum. Nunc nunc nisi, hendrerit eget nisi id, rhoncus rutrum velit. Nunc vel mauris dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam fringilla quis nisi eget imperdiet.</p>
	  </div>
	</div>
	
	<input class="ball-state" id="modal-3" type="checkbox" />
	<div class="ball">
	  <label class="ball_bg" for="modal-3"></label>
	  <div id="pr_ball3" class="pr_ball">
		<label class="ball_close" for="modal-3"></label>
		<h2>Caaaats FTW!</h2>
		<p>Aliquam in sagittis nulla. Curabitur euismod diam eget risus venenatis, sed dictum lectus bibendum. Nunc nunc nisi, hendrerit eget nisi id, rhoncus rutrum velit. Nunc vel mauris dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam fringilla quis nisi eget imperdiet.</p>
	  </div>
	</div>
	
	<input class="ball-state" id="modal-4" type="checkbox" />
	<div class="ball">
	  <label class="ball_bg" for="modal-4"></label>
	  <div id="pr_ball4" class="pr_ball">
		<label class="ball_close" for="modal-4"></label>
		<h2>Caaaats FTW!</h2>
		<p>Aliquam in sagittis nulla. Curabitur euismod diam eget risus venenatis, sed dictum lectus bibendum. Nunc nunc nisi, hendrerit eget nisi id, rhoncus rutrum velit. Nunc vel mauris dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam fringilla quis nisi eget imperdiet.</p>
	  </div>
	</div>
	
	<input class="ball-state" id="modal-5" type="checkbox" />
	<div class="ball">
	  <label class="ball_bg" for="modal-5"></label>
	  <div id="pr_ball5" class="pr_ball">
		<label class="ball_close" for="modal-5"></label>
		<h2>Caaaats FTW!</h2>
		<p>Aliquam in sagittis nulla. Curabitur euismod diam eget risus venenatis, sed dictum lectus bibendum. Nunc nunc nisi, hendrerit eget nisi id, rhoncus rutrum velit. Nunc vel mauris dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam fringilla quis nisi eget imperdiet.</p>
	  </div>
	</div>
	
	<input class="ball-state" id="modal-6" type="checkbox" />
	<div class="ball">
	  <label class="ball_bg" for="modal-6"></label>
	  <div id="pr_ball6" class="pr_ball">
		<label class="ball_close" for="modal-6"></label>
		<h2>Caaaats FTW!</h2>
		<p>Aliquam in sagittis nulla. Curabitur euismod diam eget risus venenatis, sed dictum lectus bibendum. Nunc nunc nisi, hendrerit eget nisi id, rhoncus rutrum velit. Nunc vel mauris dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam fringilla quis nisi eget imperdiet.</p>
	  </div>
	</div>
	
	<input class="ball-state" id="modal-7" type="checkbox" />
	<div class="ball">
	  <label class="ball_bg" for="modal-7"></label>
	  <div id="pr_ball7" class="pr_ball">
		<label class="ball_close" for="modal-7"></label>
		<h2>Caaaats FTW!</h2>
		<p>Aliquam in sagittis nulla. Curabitur euismod diam eget risus venenatis, sed dictum lectus bibendum. Nunc nunc nisi, hendrerit eget nisi id, rhoncus rutrum velit. Nunc vel mauris dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam fringilla quis nisi eget imperdiet.</p>
	  </div>
	</div>
	
	<input class="ball-state" id="modal-8" type="checkbox" />
	<div class="ball">
	  <label class="ball_bg" for="modal-8"></label>
	  <div id="pr_ball8" class="pr_ball">
		<label class="ball_close" for="modal-8"></label>
		<h2>Caaaats FTW!</h2>
		<p>Aliquam in sagittis nulla. Curabitur euismod diam eget risus venenatis, sed dictum lectus bibendum. Nunc nunc nisi, hendrerit eget nisi id, rhoncus rutrum velit. Nunc vel mauris dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam fringilla quis nisi eget imperdiet.</p>
	  </div>
	</div>
	
	<input class="ball-state" id="modal-9" type="checkbox" />
	<div class="ball">
	  <label class="ball_bg" for="modal-9"></label>
	  <div id="pr_ball9" class="pr_ball">
		<label class="ball_close" for="modal-9"></label>
		<h2>Caaaats FTW!</h2>
		<p>Aliquam in sagittis nulla. Curabitur euismod diam eget risus venenatis, sed dictum lectus bibendum. Nunc nunc nisi, hendrerit eget nisi id, rhoncus rutrum velit. Nunc vel mauris dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam fringilla quis nisi eget imperdiet.</p>
	  </div>
	</div>
	
	<input class="ball-state" id="modal-10" type="checkbox" />
	<div class="ball">
	  <label class="ball_bg" for="modal-10"></label>
	  <div id="pr_ball10" class="pr_ball">
		<label class="ball_close" for="modal-10"></label>
		<h2>Caaaats FTW!</h2>
		<p>Aliquam in sagittis nulla. Curabitur euismod diam eget risus venenatis, sed dictum lectus bibendum. Nunc nunc nisi, hendrerit eget nisi id, rhoncus rutrum velit. Nunc vel mauris dolor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam fringilla quis nisi eget imperdiet.</p>
	  </div>
	</div>
＆＃13;
＆＃13;
＆＃13;

这里

0 个答案:

没有答案
相关问题
最新问题