Adding a Pop-Up Dialog to your Site

Since jQuery UI is already included within mojoPortal, it’s relatively easy to create a pop-up window with just a few lines of javascript code:

<script>      $(document).ready(function () {          // Create hidden dialog for Staff #1          $('#dlgStaff1').dialog({              autoOpen: false,              width: 430          });            // Hook link to correct dialog          $('#lnkStaff1').click(function () {              $('#dlgStaff1').dialog('open');              return false;          });      });  </script>  <!-- Sample text.  Note that 2 elements are required for the proper functioning of the pop-up: a link with an id of lnkStaff1 and a div element with an id of dlgStaff1 -->  <div style="text-align: right;">      <img alt="Linda Ahuna-Hamill" class="prettify" src="/Data/Sites/1/images/faculty/lindaahuna-hamill.jpg"          style="margin: 2px; border: 3px solid; width: 200px; height: 150px; float: right;" /></div>  <p>      <strong>Name</strong>: Linda Ahuna-Hamill<br />      <strong>Position</strong>:&nbsp;<br />      <strong>Courses</strong>:<br />      <strong>Research Interests</strong>:<br />      <strong>Degree Background</strong>:<br />      <strong>Role in SAHE</strong>:</p>  <p>      <a id="lnkStaff1">Additional Information</a></p>  <div id="dlgStaff1" title="Linda Ahuna-Hamill">      Originally from CA, I earned my bachelor's degree in English from the University      of California at Irvine, home of the mighty Anteaters. I came to Colorado State      University in 1983 to pursue my master's degree in College Student Personnel Administration,      now known as SAHE, and completed the program in 1985. Almost 30 years and an additional      degree later (Ph.D. in sociology), I am still at the university. I was honored to      help develop the Asian/Pacific American Cultural Center in 1984 and to serve as      the Director of that office for 20 years. In 2004, I moved into administrative positions      in the Vice President's office and currently serve as the Assistant Vice President      for Student Affairs. I co-teach the College Student Personnel Administration class      with Mike Ellis and am an advisor in the SAHE program. I also serve as the Equal      Opportunity Coordinator for the Division of Student Affairs.&nbsp; I live with my      husband Albert, my daughter Kylia, two dogs, three horses, and two turkeys.</div>  <div class="clearfix">      <hr />  </div>

Adding A Pop Up Dialog With YouTube Video

Along the same lines as above, take a look at, which also uses jQuery UI for the modal popup.