creating a modal window

pls visyt this link-- and see that there is "log in" option at the top leftmost corner.if u click on it a modal window opens up that asks your authentication you know how i can implement the same kind of modal window ...i am using jsp..
Who is Participating?
It's not actually a modal window... it just looks like one. The effect uses layers.

The dimming effect is produced by defining a CSS ID selector specifying top left position, width, height, z-index(layer) and opacity. Which basically overlays the whole display but starts hidden using "display:none;"

For example:

#dimmer {
      position: absolute;
      width: 100%;
      height: 100%;
      z-index: 100;
      display: none;
      background-color: #000;
      opacity: .65;
      top: 0px;
      left: 0px;

When the link is clicked, the dimmer is activated using for example:

objDimmer=document.getElementById('dimmer'); = 'block';

which gives the effect of dimming the background. The foreground content is then displayed in a div on a higher level layer using a higher z-index value (for example z-index=1000). Everything in the div is handled by your JavaScript.

When you are finished, you hide the div which is your 'foreground window' and you then hide the dimmer again... = 'none';

It's actually a lot easier than it seems to do but it does take practice to get it right and it looks really well!

Albert Van HalenAnalyst developerCommented:
You might have a look at this site :
It has some samples which suits your needs. It requires jquery though.
Michel PlungjanIT ExpertCommented:
This question has been classified as abandoned and is closed as part of the Cleanup Program. See the recommendation for more details.
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.