|
1.
|
Introduction
|
|
|
This document has the same examples of speech bubble popups as in the primary
BUBBLE support document and another
BUBBLE supplement, but it includes:
OLbubbleImageDir='bubble';
OLbubbleIMGsuffix='_fcfeff';
OLbubbleRCsuffix='_fcfeff';
in a script block before those for importing the overlibmws modules, so that bubble popups will use a set
of images which have had their background color changed to #fcfeff,
have had an _fcfeff suffix added to their root name (e.g.,
flower_fcfeff.gif), and have been placed in a subdirectory named
bubble. It also includes:
RCBUBBLECOLOR,'#fcfeff'
in its OLpageDefaults function call to make the background color
for the textual content of roundcorners popups match that of the
image set which creates the border with round corners. You might also wish to
review the multicolor Speech Bubbles support document
|
|
2.
|
Examples
|
|
|
The following examples illustrate the different types of
"bubble" popups that are currently available. The bold lettering
below each link shows the overlib call to invoke it. The second call is the
same except that the ADJBUBBLE command (see below) has been added.
The flower examples use the following style rule for the text:
.comic20 {font-family:'Comic Sans MS'; font-size:20px;}
-
flower
bubble adjust bubble size
overlib('This is a <b>flower</b>
bubble popup.',
BUBBLE, TEXTFONTCLASS, 'comic20')
-
oval
bubble adjust bubble size
overlib('This is an <b>oval</b>
bubble popup.', BUBBLE,
BUBBLETYPE, 'oval', TEXTSIZE, 2, FILTER, FILTERSHADOW,1,
FILTERSHADOWCOLOR,'#60b0ff')
-
square
bubble adjust bubble size
overlib('This is a <b>square</b>
bubble popup.',
BUBBLE, BUBBLETYPE, 'square', TEXTSIZE, '83%'
-
pushpin
bubble adjust bubble size
overlib('This is a <b>pushpin</b>
bubble popup.',BUBBLE,
BUBBLETYPE, 'pushpin', TEXTSIZE, '0.83em', RELX,-50, RELY,30,
FILTER, FILTERSHADOW,2, FILTERSHADOWCOLOR,'#60b0ff')
-
quotation
bubble adjust bubble size
overlib('This is a <b>quotation</b>
bubble popup.',
BUBBLE, BUBBLETYPE, 'quotation', TEXTSIZE, 'x-small')
-
roundcorners
popup. Adjust
bubble size not applicable.
overlib('This is a <b>roundcorners</b>
popup.', BUBBLE,
BUBBLETYPE, 'roundcorners',
TEXTSIZE, 2, MIDX,30, MIDY,0, WRAP,
FILTER, FILTERSHADOW,1,
FILTERSHADOWCOLOR,'#60b0ff')
|
Note that < and >
are the HTML entity references for "<" and ">"
respectively. These are used to avoid any problems associated
with firewalls, especially Norton's firewall. Also note that
the FILTER feature for IE v5.5+ browsers is being used with the
oval, pushpin, and roundcorners
examples (and with the non-bubble popups on this page).
|
|
|
|
|
Stuart Crawshaw originally implemented
speech bubbles with an earlier version of overlib and
offered it to the Yahoo overlib group.
A simulation using overlibmws_bubble.js and the mws core module's REF-based
positioning and class-based text styling (TEXTFONTCLASS) is at left.
Hover over the blue car first, then the mauve car, and finally the man at the left of the picture to see the speech
bubbles invoked via an image map.
|
|
|
|
