CODEWITHSUNDEEP
javascript
Don Abbot
Don Abbot

Reputation: 121

Onload function not working properly

Right now, the image is highlighted when the user clicks on an image . What I am trying to do is on onload, the first image will be highlighted until the user clicks on another image. However, it is not working. Am I doing this completely wrong?

      for (var i = 0; i < e.mediaList.length; i++) {
        var media = e.mediaList[i];
        if (media) {
          playlistHTML += '<div id="thumbwrap" >';
          if (i == 0){
          playlistHTML += '<a id="thumbwrap1" href="javascript:onPlaylistItemClick(\'' + media.id + '\');" onClick="javascript:highlightLink(this);" onload ="javascript:highlightLink(document.getElementById(this));">';}
          else{           
        playlistHTML += '<a id="thumbwrap1" href="javascript:onPlaylistItemClick(\'' + media.id + '\');" onClick="javascript:highlightLink(this);"  >';} #call function here


          playlistHTML += '<img width="106"  height="62" style="padding:2px;"  src="' + media.thumbnailUrl + '"/>';

          playlistHTML += '<div id="thumbwrap-title">' + media.title + '</div>';
          playlistHTML += '</a>';
          playlistHTML += '</div>';
        }
      }

Function for activating image highlight. 

var highlightLink = function () {
        var active = null, colour = '#FF8C00';
        if (this.attachEvent) this.attachEvent('onunload', function () {
            active = null;
        });
        return function (element) {
            if ((active != element) && element.style) {
                if (active) active.style.backgroundColor = '';
                element.style.backgroundColor = colour;
                active = element;
            }
        };
    }();

Upvotes: 0

Views: 141

Answers (1)

me_digvijay
me_digvijay

Reputation: 5492

The onload event is not supported by the a tag. You should attach the event to the img instead of the a tag. Here is a list List of tags that spport the onload event.

Upvotes: 1

Related Questions