title: Toggle divs for open/close with Derek Perez PageSlide
body: <p>I'm trying to use <a href="http://derekperez.com/jquery-pageslide/demo/" rel="nofollow noreferrer">Derek Perez PageSlide Plugin for jQuery</a> in a Wordpress site. Default beahaviour is a link to open it, and click anywhere else on the page to close it.</p>
  
  <p>I would like to toggle images saying "open" when it's closed and "close" when it's open.
  So I have played around with jquery toggle() and enclosing the links in divs but can't get it to work. I can get 2 simple divs to toggle, but not with link content. </p>
  
  <p><strong>open link:</strong><br>
  <code>&lt;a href="_right.html" id="slide-right"&gt;</code></p>
  
  <p><strong>close link:</strong><br>
  <code>&lt;a  href="javascript:;" class="pageslide-close"&gt;</code></p>
  
  <p><strong>Below enclosed in divs with images to clarify:</strong><br>
  <code>&lt;div id="opendiv"&gt;</code><br>
  <code>&lt;a href="_right.html" id="slide-right"&gt;&lt;img src="open.png"&gt;&lt;/a&gt;</code><br>
  <code>&lt;/div&gt;</code><br></p>
  
  <p><code>&lt;div id="closediv"&gt;</code><br>
  <code>&lt;a  href="javascript:;" class="pageslide-close"&gt;&lt;img src="close.png"&gt;&lt;/a&gt;</code><br>
  <code>&lt;/div&gt;</code><br></p>
  
  <p>Any ideas? Thank's /Bo</p>
  
  <p><strong>Edit:</strong><br>
  Seems like the below script part, that has to be located at the very bottom of the page, interrupts the execution of the jquery toggle() function. Ideas?</p>
  
  <p><code>&lt;script type="text/javascript"&gt;</code><br>
      <code>$("#slide-left").pageSlide({ width: "350px", direction: "left" });</code><br>
      <code>$("#slide-right").pageSlide({ width: "350px", direction: "right" });</code><br>
      <code>$("#slide-modal").pageSlide({ width: "350px", direction: "left", modal: true });</code><br>
    <code>&lt;/script&gt;</code></p>