add popup target attributes example

Author: josepharhar

source

@@ -81910,6 +81910,30 @@ dictionary <dfn dictionary>DragEventInit</dfn> : <span>MouseEventInit</span> {
    data-x="attr-popup-show-target">popupshowtarget</code></dfn></p></li>
   </ul>
 
+  <div class="example">
+   <p>The following shows how <code data-x="attr-popup-show-target">popupshowtarget</code> can be
+   used to open a pop-up:</p>
+
+   <pre><code class="html">&lt;div popup=auto id="foo">
+  This is a pop-up!
+&lt;div>
+
+&lt;button popupshowtarget="foo">
+  Show a pop-up
+&lt;button></code></pre>
+
+   <p>The following shows how <code data-x="attr-popup-toggle-target">popuptoggletarget</code> can
+   open and close a manual pop-up, which can't be closed with light dismiss:</p>
+
+   <pre><code class="html">&lt;div popup=manual id="foo">
+  This is a pop-up!
+&lt;div>
+
+&lt;button popuptoggletarget="foo">
+  Show or hide a pop-up
+&lt;button></code></pre>
+  </div>
+
   <p>The <span>pop-up target attributes</span> allow certain types of buttons to show and hide
   element with the <code data-x="attr-popup">popup</code> attribute.</p>