Full width home advertisement

SQL

ASP.NET

Post Page Advertisement [Top]

Merhaba,
        Bu yazımızda javascript ile popup pencere oluşturacağız, aslıda çok basit bir işlem web geliştiriciler için fakat popup'ın bir diğer linke tıklandığında kaybolmamasını, tekrar tekrar aynı linke basıldığında tekrarlanmamasını istiyorsanız durum farklı :)


     İşte bu yazıda tam da bunu anlatıyorum.Yeni bir ASP.Net WebSitesi projesi oluşturarak işe başlayalım.
Ne dinlemeli ?
     Senaryomuza göre Default.aspx ve PopUpPage.aspx sayfalarını oluşturalım.


PopupPage sayfasında resim göstermek için img klasörümüzü ve resmimizi ekleyelim.



Şimdi bu işlev için temel olacak javascript fonksiyonunu Default.aspx sayfasının head kısmına ekleyelim.Bu fonksiyonda window.open ile bir popup açılıyor fakat devam eden if şartı ile zaten popup varsa tekrarlanmıyor ve o popup'a odaklanılıyor.

    <script type="text/javascript">
        function popitup(url) {
            newwindow = window.open(url, 'name', 'height=500,width=450');
            if (window.focus) { newwindow.focus() }
            return false;
        }

    </script>

Ve body tagında bir link oluşturalım ve bu javascript metodumuzu çağıralım.

<a href="PopUpPage.aspx" onclick="return popitup('PopUpPage.aspx')">Link to popup</a>

 Default.aspx sayfasının son hali aşağıdaki gibi olacaktır.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>NonObscureJavaScriptPopUp</title>
    <script type="text/javascript">
        function popitup(url) {
            newwindow = window.open(url, 'name', 'height=500,width=450');
            if (window.focus) { newwindow.focus() }
            return false;
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <a href="PopUpPage.aspx" onclick="return popitup('PopUpPage.aspx')">Link to popup</a>
        </div>
    </form>
</body>
</html>

Popup'da açılacak sayfamızı kodlayalım.Basit bir şekilde bir başlık ve resim ekleyelim.

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="PopUpPage.aspx.cs" Inherits="PopUpPage" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    <h4>Hello from popup page!</h4>
          <img width="400" src="./img/jcvdandhisdog.jpg"/>
    </div>
    </form>
</body>
</html>

Projemizi sorun olmadan çalıştıralım ve sonucu görelim.



Aynı linke bir çok defa tıklayarak ya da iki ayrı link oluşturarak dediğim özelliklerin gerçekleştiğini görebilirsiniz.Projeyi githubımda bulabilirsiniz.

Bugün denemeye çalışacağım 10K koşusu için bana şans dileyin :)

Sağlıkla huzurla,sporla kalın :)

Hiç yorum yok:

Yorum Gönder

Bottom Ad [Post Page]