CODEWITHSUNDEEP
javascriptdom
user2988869
user2988869

Reputation: 21

Adding functionality by accessing the DOM

I am trying to add mouseOver and Click function to a HTML page with JavaScript. I have a html and CSS files that are not to be touched but the JavaScript file is to make drop down menus on the right with mouseOver, Click functionality to be added to the "Like" and "Hide" links that change to unlike and the "Hide" button is to hide the message box. While the "Refresh" gets a "onClick" button that is to add new message boxes to the page that are stored in an array that gets formed with the initialize function along with the functionality to the Menu on the right and the "Like" and "Hide" links and the "Refresh" Button.

There are 4 .png files that I was not able to attach to the jsFiddle. They are supposed to change from 1-4 in the space next to the Friends Panel attomatically. see code HERE

PASSWORD: Mypassword1

The Drop Down Menu is not showing on the jsFiddle for some reason it can be viewed in FireFox.

    function initialise(){
          var msgs = new Array();
        msgS = [
    {title: 'Bob',
     img: 'bob.png',
     username:'Bob',
     userid: '@bob',
     msgtext: "Still waiting for a reply... What's the plan?"
     },
    {title: 'Kurt',
     img: 'kvj.png',
     username:'Kurt',
     userid: '@kvj',
     msgtext: "So it goes..."
     },
    {title: 'Robot',
     img: 'robot.png',
     username:'Robot',
     userid: '@robot',
     msgtext: "Don't worry... found some."
     }];

          preloadHideDropDownMenu();
          menuDropDownMouseOver();
          preloadRotate();
          var picture=0;//to be used with circulate

          setTimeout('circulate(picture)',3000);
          preloadLikeFunction();
          preloadHideFunction();
          preloadRefreshLink();
}

This Function get executed when the page loads and sets up the MouseOver, Click funcions and the Array that holds the new message boxes that get loaded on click of the Refresh button.

Upvotes: 0

Views: 41

Answers (1)

Jason M. Batchelor
Jason M. Batchelor

Reputation: 2951

Always check the console for Javascript errors. At least one of your errors is in regard to this:

function preloadHideDropDownMenu(){
     var first=document.getElementById("navigate");
     var Array menu=new Array(); <-- There is no explicit object typing in JS
     menu=first.childNodes;
      for(var i=0; i<menu.length; i++){
          var nextArray=new Array();
          nextArray=menu[i].childNodes;
           for(var j=0; j<nextArray.length; j++){
               if(nextArray[j].className=="item"){
                  nextArray[j].style.visibility="hidden";
}}}}

var Array menu=new Array(); is not proper JS syntax. var menu = new Array(); would be, or even var menu = [];

I noticed that in your other preload* functions. Try fixing those, first, check your work in the Console, and see if that solves your issues. Good luck!

Also, things like this do not fly in JS:

function menuVisible(var dropdown=0){

You can't type parameters in Javascript, or give them default values.

Something you should look at in jsFiddle is the JSHint button. When you click on that, it will put little red dots next to errors or suggestions for best practices in writing your JS.

Upvotes: 1

Related Questions