Dreamweaver CS4 Tutorial - 41 - Tool Tips Video Lecture | How to create Responsive Websites with DreamWeaver - IT & Software

hello and welcome to another sprite
tutorial in this tutorial we are going
to create a sprite tooltip when you're
creating a spy tool tip what it is is
something that pops up whenever you
scroll over a specified region or a
specified block element you can you can
do this over a div tag over an image or
basically any block element that you
want to create a tooltip for so for this
example we're just going to highlight
some text and we're going to display a
tooltip whenever someone hovers over
that so you click on sprite tooltip as
you can see it inserted a span around
the text that we highlighted and also
inserted a div down here and this is
where the content goes so I'm just going
to copy this and throw it inside this
div save that let go here and reload
this page and now you can see that
whenever we scroll over this text
tooltip is going to pop up our few
options that we can mess around with
when dealing with some tooltips here we
can see that we have a follow a mouse
and hide all mouse out follow Mouse
means that it's going to follow the
mouse everywhere it goes just like that
hydel mouse out means that it's going to
hide whenever the mouse goes outside of
either this specified area by specified
area I mean this and also if if the
cursor is inside of the tooltip then
it's going to the tooltip will stay up
for this example we are just going to
leave that unchecked
but now you know what it is and they
also have some effects blind and fade
you can check those out if you want and
we also have a delay for the defects for
the effects and for the the tooltip if
if you want to have a delay and we can
also change some horizontal and vertical
offsets and what that means is it's
going to move over a horizontally left
to right or vertically up and down based
on the number that you put from where
the mouse position once it enters in the
area is and that is it for tooltips
might as you can see is there's not much
here in the CSS I added some padding and
you can change the background color if
you want change it to white and maybe
give it a border to oops border is one
big solid black ok save that
reload what we didn't save the CSS there
we go now you can see there's a white
background with a black border so that
is how you create a tooltip inside of
Dreamweaver cs4 very simple very cool
and the next tutorial we're going to
start dealing with some sprite datasets
see how to display a large amount of
data using XML and a sprite data set so
make sure you check out that tutorial
don't forget to subscribe and I will see
you in the next tutorial