<

html

>

<

head

>

<

title

>LIGHTBOX EXAMPLE

</

title

>

<

meta 

http-equiv

="Content-Type"

 content

="text/html; charset=gb2312"

 

/>

    

<

style 

type

="text/css"

>

          .black_overlay

{

             display

:

 none

;

 

             position

:

 absolute

;

  

             top

:

 0%

;

  

             left

:

 0%

;

  

             width

:

 100%

;

  

             height

:

 100%

;

  

             background-color

:

 black

;

  

             z-index

:

1001

;

  

             -moz-opacity

:

 0.8

;

  

             opacity

:

.80

;

  

             filter

:

 alpha(opacity=80)

;

  

        

}

 

        .white_content 

{

            display

:

 none

;

  

            position

:

 absolute

;

 

            top

:

 25%

;

 

            left

:

 25%

;

 

            width

:

 50%

;

 

            height

:

 50%

;

 

            padding

:

 16px

;

            border

:

 2px solid orange

;

 

            background-color

:

 white

;

 

            z-index

:

1002

;

            overflow

:

 auto

;

        

}

  

    

</

style

>

    

<

script 

language

="javascript"

>

        

function

 openWindow(){

            document.getElementById(

'

light

'

).style.display

=

'

block

'

;

            document.getElementById(

'

fade

'

).style.display

=

'

block

'

;

        }

        

function

 closeWindow(){

            document.getElementById(

'

light

'

).style.display

=

'

none

'

;

            document.getElementById(

'

fade

'

).style.display

=

'

none

'

;

        }

    

</

script

>

</

head

>

<

body

>

    

    

<

p

>可以根据自己要求修改css样式

    

<

input 

type

="button"

 value

="点击这里打开窗口"

 onclick

="openWindow()"

/></

p

>

    

</

body

>

    

<

div 

id

="light"

 class

="white_content"

>

     This is the lightbox content.

     

<

a 

href

="#"

 onClick

="closeWindow()"

> Close

</

a

></

div

>

    

<

div 

id

="fade"

 class

="black_overlay"

></

div

>

    

</

html

>