Mootools rollover action problem

Discussion in 'JavaScript' started by newbie88, Jan 14, 2010.

0
  1. #1
    Hi,

    I am needing some help with the mootools script. I have uploaded a test page at http://74.52.32.68/~tempcom/slider/

    Here is what I am attempting to do. When I click on one of the items (say Landscapes), I want some corresponding text to appear in the green box above. Is this possible? Would it be a javascript?

    Any sample codes or assistance would be greatly appreciated. Thanks in advance!
     
    newbie88, Jan 14, 2010 IP
  2. harrierdh

    harrierdh Peon

    Messages:
    46
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Here are two code snippets for you to try. By the way you are missing a closing </div> tag for <div id="imageMenu">

    
<head>
<script>
    function populateGreenBox() {
	    document.getElementById("details").innerHTML = "whatever text you want";
	}
</script>	
</head>
<body>
<div id="details">&nbsp;</div>
<a href="#" style="width: 98px;" onClick="populateGreenBox()">Landscapes</a>
</body>
    Code (markup):
    
<head>
<script>
    function populateGreenBox(obj) {
	    document.getElementById("details").innerHTML = document.getElementById(obj.id).innerHTML;
	}
</script>	
</head>
<body>
<div id="details">&nbsp;</div>
<a href="#" style="width: 98px;" id="landscape" onClick="populateGreenBox(this)">Landscapes</a>
</body>
    Code (markup):
     
    harrierdh, Jan 14, 2010 IP
  3. dimitar christoff

    dimitar christoff Active Member

    Messages:
    882
    Likes Received:
    62
    Best Answers:
    0
    Trophy Points:
    90
    #3
    modify the line where you instigate the class:
    
var myMenu = new ImageMenu($$('#imageMenu a'),{openWidth:310, border:2, onOpen: function(e,i) {
    $("details").set("html", "something"); // relate to 'e'
}});
    Code (javascript):
    you need to set proper urls under the menu items and you can use $("details").load(e); to fetch the content via ajax.
     
    dimitar christoff, Jan 15, 2010 IP
  4. newbie88

    newbie88 Peon

    Messages:
    2
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    @harrierdh - Thanks for responding! I tried out the code and when I click, the text appears but it also opens up a new window. How do I stop this? Also, how do I apply this to the remaining menu items? My newbie mind tells me to paste the "function populateGreenBox" code 7 times but..it just doesnt seem right =)

    @dimitar christoff - Thanks for responding! I am afraid javascript and ajax are still very new to me and am not too sure how to use the coding you provided.

    I really appreciate your patience and assistance!
     
    newbie88, Jan 16, 2010 IP