Load the popup on just the first time page request only

protected void Page_Load(object sender, EventArgs e)
    {
        if (IsPostBack)
        {
            ClientScript.RegisterHiddenField("isPostBack", "1");
        }
}
<script type="text/javascript" >

        $(document).ready(function() {

            var isPostBackObject = document.getElementById('isPostBack');
            if (isPostBackObject == null) {
                var id = '#dialog';
                //modal: true
                //Get the screen height and width
                var maskHeight = $(document).height();
                var maskWidth = $(window).width();

                //Set heigth and width to mask to fill up the whole screen
                $('#mask').css({ 'width': maskWidth, 'height': maskHeight });

                //transition effect  
                $('#mask').fadeIn(1000);
                $('#mask').fadeTo("slow", 0.9);

                //Get the window height and width
                var winH = $(window).height();
                var winW = $(window).width();

                //Set the popup window to center
                $(id).css('top', winH / 2 - $(id).height() / 2);
                $(id).css('left', winW / 2 - $(id).width() / 2);

                //transition effect
                $(id).fadeIn(2000);

                //if close button is clicked
                $('.window .close').click(function(e) {
                    //Cancel the link behavior
                    e.preventDefault();

                    $('#mask').hide();
                    $('.window').hide();
                });

            }
<style type="text/css">
  #mask {
  position:absolute;
  padding-left:60px;
  padding-top:80px;
  padding-bottom:80px;
  padding-right:50px; /*-- These Padding is for the border of jquery Pop-up --*/
  left:0;
  top:0;
  z-index:9999;
  background-color:#000000;
  display:none;
}  
#boxes .window {
  position:absolute;
  left:0;
  top:0;
  width:330px;
  height:147px;
  display:none;
  z-index:9999;
  padding:20px;
  background-color:#000000;  
  border: 20px solid #79BBFD;  
  border-radius: 10px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;

}
#boxes #dialog {
  padding:10px;
  background:url('images/localOffers-bg.jpg'); 
  width:330px; height:147px; 
  background-repeat:no-repeat; 
  margin-top:20px;
  
}

<div id="boxes">
<div id="mask" >
<div id="dialog" class="window">
<span class="LocalOffersHeading">Find Local Offers                                     
<a href="#"  style="float: right; margin: -45px -45px 0 0;"  class="close"> 

<img src="Images/close_pop.png" alt="CLOSE" /></a> </span> <br /> <br />
Finding local offers has never been easier. Just select your city location from
the drop down and find the most recent local discounts in your area. We've also
made simple to stay in touch with you favorite merchants but signing up for the
email discounts! <br /><br />
<asp:DropDownList ID="ddlj" runat="server"  style="Width:228px;  Height:20px;" 

 OnSelectedIndexChanged="popup_SelectedIndexChanged" >
</asp:DropDownList>
                                     
<asp:ImageButton ID="jqbutton" runat="server" ImageUrl="~/images/bt-go.jpg"

 OnClick="imgBtnGo_Click"
 CausesValidation="false" Style="height: 16px;"  />
                                       
</div>
<!-- Mask to cover the whole screen -->
<%--<div style="width: 1478px; height: 602px; display: none; opacity: 0.8;" id="mask">
</div>--%>
                                </div>
                            </div>