<div data-role="page" data-dialog="true" id="d2">
<div data-role="header" data-theme="a"> <h1>UstaDerslik.com</h1> </div>
<div role="main" class="ui-content">
<h1>Başlık</h1>
<p>Burası diyalog2...</p>
</div>
</div>
<a href="#d1" class="ui-btn ui-btn-inline" data-transition="flip">Diyalog</a>
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>UstaDerslik</title>
<link rel="stylesheet" href="css/jquery.mobile-1.4.2.min.css" />
<script type="text/javascript" src="js/jquery-1.9.1.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.4.2.min.js"></script>
</head>
<body>
<div data-role="page">
<div role="main" class="ui-content">
<a href="#d1" class="ui-btn ui-corner-all ui-icon-comment ui-btn-icon-left ui-btn-inline" data-transition="flip">Diyalog-1</a>
<a href="#d2" class="ui-btn ui-corner-all ui-icon-grid ui-btn-icon-left ui-btn-inline" data-transition="slidedown">Diyalog-2</a>
</div>
</div>
<!-- Diyalog1 -->
<div data-role="page" data-dialog="true" id="d1" data-close-btn="right">
<div data-role="header" data-theme="b"> <h1>UstaDerslik.com</h1> </div>
<div role="main" class="ui-content">
<h1>Başlık</h1>
<p>Burası diyalog...</p>
<a href="dialog/index.html" data-rel="back" class="ui-btn ui-shadow ui-btn-a ui-btn-inline"> Evet </a>
<a href="dialog/index.html" data-rel="back" class="ui-btn ui-shadow ui-btn-b ui-btn-inline"> Hayır </a>
</div>
</div>
<!-- Diyalog2 -->
<div data-role="page" data-dialog="true" id="d2" data-close-btn="none">
<div data-role="header" data-theme="a"> <h1>UstaDerslik.com</h1> </div>
<div role="main" class="ui-content">
<h1>Başlık</h1>
<p>Burası diyalog2...</p>
<a href="dialog/index.html" data-rel="back" class="ui-btn ui-shadow ui-corner-all ui-btn-a">Kapat</a>
</div>
</div>
</body>
</html>