I have a home page with a simple event calendar (table with CSS styling) and I'm using Dreamweaver CS4's built-in JavaScript behaviors to make it interactive. My goal is to "reveal/hide" a hidden <div> that displays details for each calendar event. The issue I'm having is when I close the <div> that I "reveal" using the behavior, the rest of the links in the calendar don't work unless I refresh the page. I'm a total beginner when it comes to JS!

Here's the web page

3 answers


Try using jQuery for your JavaScript. It is very easy to understand.

Answered almost 8 years ago by Efficient Pixel

I would absolutely agree with Efficient Pixel. If you're doing basic DOM manipulation, there is no better tool than something like jQuery or MooTools which provide a much simpler interface for doing powerful things in Javascript.

I went to your site, but didn't see anything like what you were talking about. Please update here with more details if I'm just missing something. With that said, here's an example of how to do what you're talking about might look in jQuery:


The outter wrapper beginning with $(document) should be around any jQuery code that you write in order to ensure that the DOM is fully loaded before you attempt to do anything to it. The next line says "whever an div element with a class of 'eventlink' is clicked, toggle the visibility of any paragraph (

) tags found within the parent element of the link that was clicked. You would obviously want to refine that a lot to match the actual structure of your calendar, but that should be super simple to do. Give us more detail on what it looks like and we can give you a more accurate example!

Answered almost 8 years ago by Ryan L. Cross

Thanks Efficient Pixel! I just learned a few basics of jQuery and I already have the solution done! I used the fadeIn/Out function ... works perfect!

Answered almost 8 years ago by Kevin Tomasic