title: Popup in windows phone
body: <p>I am using Popup in windows phone,
  When I open a popup, the popup opens and the page behind the popup element can be accessible, I have a listbox and it can be scrollable.</p>
  
  <p>If popup opens the controls behind that should be non accessible , right? how can i do that, </p>
  
  <p>Here my code</p>
  
  <pre><code> Popup popup = new Popup();
                  popup.Height = 300;
                  popup.Width = 450;
                  popup.VerticalOffset = 250;
                  popup.HorizontalOffset = 20;
                  notLogedInPopup control = new notLogedInPopup();
                  popup.Child = control;
                  popup.IsOpen = true;
  </code></pre>
  
  <p>here the code for notLogedInPopup design, that is the UserControl</p>
  
  <pre><code>&lt;UserControl x:Class="offertimeline.notLogedInPopup"
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
  xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
  mc:Ignorable="d"
  FontFamily="{StaticResource PhoneFontFamilyNormal}"
  FontSize="{StaticResource PhoneFontSizeNormal}"
  Foreground="{StaticResource PhoneForegroundBrush}"
  d:DesignHeight="300" d:DesignWidth="450"&gt;
  
  &lt;UserControl.Resources&gt;
      &lt;Style x:Key="ButtonStyle1" TargetType="Button"&gt;
          &lt;Setter Property="Background" Value="Transparent"/&gt;
          &lt;Setter Property="BorderBrush" Value="{StaticResource PhoneForegroundBrush}"/&gt;
          &lt;Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/&gt;
          &lt;Setter Property="BorderThickness" Value="{StaticResource PhoneBorderThickness}"/&gt;
          &lt;Setter Property="FontFamily" Value="{StaticResource PhoneFontFamilySemiBold}"/&gt;
          &lt;Setter Property="FontSize" Value="{StaticResource PhoneFontSizeMediumLarge}"/&gt;
          &lt;Setter Property="Padding" Value="10,3,10,5"/&gt;
          &lt;Setter Property="Template"&gt;
              &lt;Setter.Value&gt;
                  &lt;ControlTemplate TargetType="Button"&gt;
                      &lt;Grid Background="Transparent"&gt;
                          &lt;VisualStateManager.VisualStateGroups&gt;
                              &lt;VisualStateGroup x:Name="CommonStates"&gt;
                                  &lt;VisualState x:Name="Normal"/&gt;
                                  &lt;VisualState x:Name="MouseOver"/&gt;
                                  &lt;VisualState x:Name="Pressed"&gt;
                                  &lt;/VisualState&gt;
                                  &lt;VisualState x:Name="Disabled"&gt;
                                      &lt;Storyboard&gt;
                                          &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentContainer"&gt;
                                              &lt;DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/&gt;
                                          &lt;/ObjectAnimationUsingKeyFrames&gt;
                                          &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="ButtonBackground"&gt;
                                              &lt;DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource PhoneDisabledBrush}"/&gt;
                                          &lt;/ObjectAnimationUsingKeyFrames&gt;
                                          &lt;ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="ButtonBackground"&gt;
                                              &lt;DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/&gt;
                                          &lt;/ObjectAnimationUsingKeyFrames&gt;
                                      &lt;/Storyboard&gt;
                                  &lt;/VisualState&gt;
                              &lt;/VisualStateGroup&gt;
                          &lt;/VisualStateManager.VisualStateGroups&gt;
                          &lt;Border x:Name="ButtonBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" CornerRadius="0" Margin="{StaticResource PhoneTouchTargetOverhang}"&gt;
                              &lt;ContentControl x:Name="ContentContainer" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Foreground="{TemplateBinding Foreground}" HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}" Padding="{TemplateBinding Padding}" VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"/&gt;
                          &lt;/Border&gt;
                      &lt;/Grid&gt;
                  &lt;/ControlTemplate&gt;
              &lt;/Setter.Value&gt;
          &lt;/Setter&gt;
      &lt;/Style&gt;
  </code></pre>
  
  <p></p>
  
  <pre><code>&lt;Grid x:Name="LayoutRoot"&gt;
      &lt;Grid.Background&gt;
          &lt;ImageBrush ImageSource="/offertimeline;component/images/listbg.png" /&gt;
      &lt;/Grid.Background&gt;
      &lt;Image Source="/offertimeline;component/images/filtertitlebg.png" Margin="0,-2,0,242" Name="bgImage" Stretch="Fill" /&gt;
      &lt;Image Margin="9,5,0,255" Source="/offertimeline;component/images/alert_icon.png" Name="alertIconImage" Stretch="Fill" HorizontalAlignment="Left" Width="51" /&gt;
      &lt;Button Style="{StaticResource ButtonStyle1}" BorderThickness="0" Margin="354,-2,13,241" Name="closeBtn" VerticalAlignment="Stretch" VerticalContentAlignment="Stretch" ManipulationCompleted="closeBtn_ManipulationCompleted" ManipulationDelta="closeBtn_ManipulationDelta" ManipulationStarted="closeBtn_ManipulationStarted"&gt;
          &lt;Button.Background&gt;
              &lt;ImageBrush ImageSource="/offertimeline;component/images/filter_close.png" /&gt;
          &lt;/Button.Background&gt;
      &lt;/Button&gt;
      &lt;TextBlock Margin="55,10,124,255" Text="Login Required" TextAlignment="Center" Foreground="Black" Name="titleTextBx" FontSize="24" /&gt;
      &lt;TextBlock Height="89" HorizontalAlignment="Left" Margin="28,124,0,0" Name="contentTextBx" Text="Please login with your credentials to do this." VerticalAlignment="Top" Width="406"  Foreground="Gray" TextWrapping="Wrap" FontSize="22"  TextAlignment="Center" /&gt;
      &lt;Button Style="{StaticResource ButtonStyle1}" Height="72" HorizontalAlignment="Left" Margin="131,240,0,0" Name="okBtn" VerticalAlignment="Top" Width="160" BorderThickness="0" BorderBrush="{x:Null}" Click="okBtn_Click" ManipulationCompleted="okBtn_ManipulationCompleted" ManipulationDelta="okBtn_ManipulationDelta" ManipulationStarted="okBtn_ManipulationStarted"&gt;
          &lt;Button.Background&gt;
              &lt;ImageBrush ImageSource="/offertimeline;component/images/okbtn.png" /&gt;
          &lt;/Button.Background&gt;
      &lt;/Button&gt;
  &lt;/Grid&gt;
  </code></pre>
  
  <p></p>
  
  <p>Thank you.</p>