title: Link Slide Text in JQuery List Rotator
body: <p>I am trying to modify jQuery List Rotator as it appears the author has abandoned the project.  By default, the slide image can be hyperlinked, however, text that displays over the top of the slide does not get hyperlinked.  I've figured out part of the solution.</p>
  
  <p>I wrapped the resulting div in an anchor tag.  I figured out where in the code to modify the href property, at least it seems to work if I add static text for the link.  What I cannot figure out is how to apply the hyperlink specified for the image to the new anchor tag wrapping the text div.</p>
  
  <pre><code>    //init main screen
      ListRotator.prototype.initMainScreen = function() {
          var content =  "&lt;div class='preloader'&gt;&lt;/div&gt;\
                          &lt;div class='timer'&gt;&lt;/div&gt;\
                          &lt;div class='textbox'&gt;\
                              &lt;a href='#'&gt;\
                              &lt;div class='inner-bg'&gt;&lt;/div&gt;\
                              &lt;div class='inner-text'&gt;&lt;/div&gt;\
                              &lt;/a&gt;\
                          &lt;/div&gt;\
                          &lt;div class='cpanel'&gt;\
                              &lt;div class='play-btn'&gt;&lt;/div&gt;\
                              &lt;div class='num-info'&gt;&lt;/div&gt;\
                          &lt;/div&gt;";
          this._$screen.append(content).css({width:this._screenWidth, height:this._screenHeight});
          this._$preloader = this._$screen.find("&gt;.preloader");
          this.initTimerBar();
          this._$textBox = this._$screen.find("&gt;.textbox");
          this._$innerText = this._$textBox.find(".inner-text");
  
          this._$strip = $("&lt;div class='strip'&gt;&lt;/div&gt;");
          if (this._defaultEffect == "h.slide") {
              this._$screen.append(this._$strip);
              this._$strip.css({width:2*this._screenWidth, height:this._screenHeight});
              this._$listItems.removeAttr("effect");
          }
          else if (this._defaultEffect == "v.slide"){
              this._$screen.append(this._$strip);
              this._$strip.css({width:this._screenWidth, height:2*this._screenHeight});
              this._$listItems.removeAttr("effect");
          }
          else {
              this._$mainLink = $("&lt;a href='#'&gt;&lt;/a&gt;");
              this._$screen.append(this._$mainLink);
          }
          this.initCPanel();          
      }
  
      //update text box
      ListRotator.prototype.updateText = function(e) {
          var that = e.data.elem;
          if (!that._$textBox.data("visible")) {
              that._$textBox.data("visible", true);
              var text = that._$listItems.eq(that._currIndex).find("&gt;div:hidden").html();
  
              //alert(that._$textBox.data("imgurl"));
              if (text &amp;&amp; text.length &gt; 0) {          
                  var data = that._$listItems.eq(that._currIndex).data("textbox");
                  that._$innerText.css("color",data.color);
                  that._$textBox.find("&gt;.inner-bg").css({"background-color":data.bgcolor, height:data.h+2});
                  that._$textBox.find("a").attr('href', 'IWantTheDynamicLinkHere.html');  ///////////////////////
                  switch(TEXT_EFFECTS[that._textEffect]) {
                      case TEXT_EFFECTS["fade"]:
                          that.fadeInText(text, data);
                          break;
                      case TEXT_EFFECTS["down"]:
                          that.expandText(text, data, {width:data.w, height:0}, {height:data.h});
                          break;
                      case TEXT_EFFECTS["right"]:
                          that.expandText(text, data, {width:0, height:data.h}, {width:data.w});
                          break;
                      case TEXT_EFFECTS["left"]:
                          that.expandText(text, data, {"margin-left":data.w, width:0, height:data.h}, {width:data.w, "margin-left":0});
                          break;
                      case TEXT_EFFECTS["up"]:
                          that.expandText(text, data, {"margin-top":data.h, height:0, width:data.w}, {height:data.h, "margin-top":0});
                          break;  
                      default:
                          that.showText(text, data);
                  }
              }                   
          }
      }
  </code></pre>