|
نیازمند امکانی مشابه modal در بوت استرپ
|
|
13-10-1394، 09:01 ب.ظ
سلام
میخوام یه باکس مخفی داشته باشم و بعد از کلیک روی یه دکمه صفحه تار بشه و اون باکس نمایش داده بشه مشابه modal توی بوت استرپ راهنمایی می کنید چطور بدون بوت استرپ بنویسمش؟ یا لینک آموزشی؟
14-10-1394، 12:46 ق.ظ
خب میتونی فقط از Modal اش استفاده کنی بدون اینکه باقی چیزها رو لود کنی
درهرصورت چیزی که زیاده Modal http://forum.ncis.ir/Thread-%D8%A7%DB%8C...46#pid5446 http://www.w3schools.com/w3css/w3css_modal.asp <!DOCTYPE html>
<html>
<title>Pur CSS & JS Modal</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.modal {
z-index: 1;
display: none;
padding-top: 100px;
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
overflow: auto;
background-color: rgb(0,0,0);
background-color: rgba(0,0,0,0.4);
}
@media (max-width: 768px)
.modal-content {
width: 500px;
}
.modal-content {
margin: auto;
background-color: #fff;
position: relative;
padding: 0;
outline: 0;
width: 600px;
}
.container {
padding: 0.01em 16px;
}
.closebtn {
text-decoration: none;
float: left;
font-size: 24px;
font-weight: bold;
cursor: pointer;
color: white;
margin-left: -16px;
background: #7F7F7F;
width: 20px;
}
.container:after, .clear:after, .btn-group:before, .btn-group:after {
content: "";
display: table;
clear: both;
}
</style>
<body class="container" style="text-align: center;">
<h2>Pur CSS & JS Modal</h2>
<button onclick="document.getElementById('id01').style.display='block'" class="btn">Open Modal</button>
<div id="id01" class="modal">
<div class="modal-content">
<div class="container">
<span onclick="document.getElementById('id01').style.display='none'" class="closebtn">×</span>
<h1 style="text-align: center;">Pur CSS & JS Modal</h1>
<p style="text-align: center;">Some text. Some text. Some text.</p>
</div>
</div>
</div>
</body>
</html>
یادگیری مداوم حداقل شرط لازم برای موفقیت در هر زمینه ای است که در آن فعالیت می کنید؛ هر روز چیز جدیدی بیاموزید.
|
|
|
