Smarty Manual
Prev | Chapter 8. Custom Functions | Next

# {popup}

`{popup}` is used to create Javascript popup layer/windows. `{popup_init}` MUST be called first for this to work.

Attribute Name | Type | Required | Default | Description
--- | --- | --- | --- | ---
text | string | Yes | n/a | the text/html to display in the popup window
trigger | string | No | onMouseOver | what is used to trigger the popup window. Can be one of onMouseOver or onClick
sticky | boolean | No | `FALSE` | makes the popup stick around until closed
caption | string | No | n/a | sets the caption to title
fgcolor | string | No | n/a | color of the inside of the popup box
bgcolor | string | No | n/a | color of the border of the popup box
textcolor | string | No | n/a | sets the color of the text inside the box
capcolor | string | No | n/a | sets color of the box's caption
closecolor | string | No | n/a | sets the color of the close text
textfont | string | No | n/a | sets the font to be used by the main text
captionfont | string | No | n/a | sets the font of the caption
closefont | string | No | n/a | sets the font for the "Close" text
textsize | string | No | n/a | sets the size of the main text's font
captionsize | string | No | n/a | sets the size of the caption's font
closesize | string | No | n/a | sets the size of the "Close" text's font
width | integer | No | n/a | sets the width of the box
height | integer | No | n/a | sets the height of the box
left | boolean | No | `FALSE` | makes the popups go to the left of the mouse
right | boolean | No | `FALSE` | makes the popups go to the right of the mouse
center | boolean | No | `FALSE` | makes the popups go to the center of the mouse
above | boolean | No | `FALSE` | makes the popups go above the mouse. NOTE: only possible when height has been set
below | boolean | No | `FALSE` | makes the popups go below the mouse
border | integer | No | n/a | makes the border of the popups thicker or thinner
offsetx | integer | No | n/a | how far away from the pointer the popup will show up, horizontally
offsety | integer | No | n/a | how far away from the pointer the popup will show up, vertically
fgbackground | url to image | No | n/a | defines a picture to use instead of color for the inside of the popup.
bgbackground | url to image | No | n/a | defines a picture to use instead of color for the border of the popup. NOTE: You will want to set bgcolor to "" or the color will show as well. NOTE: When having a Close link, Netscape will re-render the table cells, making things look incorrect
closetext | string | No | n/a | sets the "Close" text to something else
noclose | boolean | No | n/a | does not display the "Close" text on stickies with a caption
status | string | No | n/a | sets the text in the browsers status bar
autostatus | boolean | No | n/a | sets the status bar's text to the popup's text. NOTE: overrides status setting
autostatuscap | string | No | n/a | sets the status bar's text to the caption's text. NOTE: overrides status and autostatus settings
inarray | integer | No | n/a | tells overLib to read text from this index in the ol_text array, located in overlib.js. This parameter can be used instead of text
caparray | integer | No | n/a | tells overLib to read the caption from this index in the ol_caps array
capicon | url | No | n/a | displays the image given before the popup caption
snapx | integer | No | n/a | snaps the popup to an even position in a horizontal grid
snapy | integer | No | n/a | snaps the popup to an even position in a vertical grid
fixx | integer | No | n/a | locks the popups horizontal position Note: overrides all other horizontal placement
fixy | integer | No | n/a | locks the popups vertical position Note: overrides all other vertical placement
background | url | No | n/a | sets image to be used instead of table box background
padx | integer,integer | No | n/a | pads the background image with horizontal whitespace for text placement. Note: this is a two parameter command
pady | integer,integer | No | n/a | pads the background image with vertical whitespace for text placement. Note: this is a two parameter command
fullhtml | boolean | No | n/a | allows you to control the html over a background picture completely. The html code is expected in the "text" attribute
frame | string | No | n/a | controls popups in a different frame. See the overlib page for more info on this function
function | string | No | n/a | calls the specified javascript function and takes the return value as the text that should be displayed in the popup window
delay | integer | No | n/a | makes that popup behave like a tooltip. It will popup only after this delay in milliseconds
hauto | boolean | No | n/a | automatically determine if the popup should be to the left or right of the mouse.
vauto | boolean | No | n/a | automatically determine if the popup should be above or below the mouse.

Example 8-25. {popup}
    {* popup_init must be called once at the top of the page *}
    {popup_init src='/javascripts/overlib.js'}

    {* create a link with a popup window when you move your mouse over *}
    <a href="mypage.html" {popup text='This link takes you to my page!'}>mypage</a>

    {* you can use html, links, etc in your popup text *}
    <a href="mypage.html" {popup sticky=true caption='mypage contents'
    text="<ul><li>links</li><li>pages</li><li>images</li></ul>"
    snapx=10 snapy=10 trigger='onClick'}>mypage</a>

    {* a popup  over a table cell *}
    <tr><td {popup caption='Part details' text=$part_long_description}>{$part_number}</td></tr>

There is another good example on the `{capture}` page.

See also `{popup_init}` and the overLib homepage.

Prev | Home | Next
{math} | Up | {popup_init}