Javascript Help

[Redeye]

Hey guys,

I am not very good when it comes to Javascript yet and I am having trouble getting an idea I have into practice.

Basically, my issue is that I want a picture to exist in my PHP script which when clicked upon, it disappears and shows up a menu (well, linked html with <br /> s lol). This would be in a table (i.e. in a <td> is where the picture is contained).

Not sure if I am being clear.

Thanks,

Redeye

[Dave]

If you used jQuery you could do something as simple as:

$('.element').click(function() {
// Calls when the element is clicked
$(this).fadeOut(500, function() {
	//Hide the current element
	$('.menu').fadeIn(500);
});
});

Then have your markup something like:

<div class="element">
Your picture goes here.
</div>

<div class="menu">
Your menu here.
</div>

This is untested but it should work, I hope.

Edited April 21, 2011 by Dave Macaulay

[a_bertrand]

Honestly I didn't really understood it....

[Dave]

I forgot to add you'll need to make sure the menu element is hidden upon load. You can do this with a simple bit of CSS.

.menu {
display: none;
}

[Redeye]

Hey Dave,

Thanks for the help but it doesn't seem to work.

I think it may be the way that I am integrating it into the PHP or something.

Near the top of the page, I have

 

echo "<script src='jquery-1.5.2.min.js'>
$('.element1').click(function() {
   // Calls when the element is clicked
   $(this).fadeOut(500, function() {
       //Hide the current element
       $('.jail').fadeIn(500);
   });
});
</script>";

 

And where I want the Jail menu to pop up after clicking, I have this code (in an echo statement)

 

<td valign=top align=left>

<div class='element'>
   <img src='jail.gif' align='center' width='90%'>
</div>

<div class='jail'>
   <a href='jail.php>Jail</a>
</div></td>

 

Since I will be doing it multiple times (and have more things in the menu), I want to get this one working first of all lol.

Cheers,

Redeye

P.S. Ignore all the <br /> s that appear because of MWG adding them into for some reason

Edited April 21, 2011 by Dave Macaulay
Fixing the <br /> tags.

[Dave]

Ohh. You've changed the code in the jQuery to

$('.element1').click(function() {

Yet the element within your mark up still has the class of "element".

[Redeye]

Ohh. You've changed the code in the jQuery to

 

$('.element1').click(function() {

 

Yet the element within your mark up still has the class of "element".

Hey mate,

It seems like I must have made a change after I posted this up since the class is element1 for the div