css - PHP: Add hover effect to image -
i working on php file. i'm working on menu bar, menu bar contains image buttons, if hovers on 1 of buttons want them change image(color). me out this?
$globalsettings = array( 'src' => $simageurl.'global1.png', 'alt' => $clang->gt("global participant settings"), 'title' => $clang->gt("global participant settings"), 'style' => 'margin-left:5px', 'style' => 'margin-right:1px' );
you can create hover effects using css (cascading stylesheets). css must in external stylesheet or embedded style element.
i'm using button
style <button>
elements, can replace whatever element want style, such <img>
img
(lowercase or uppercase).
button { background: url(my_bg.png); } button:hover { background: url(my_hover_bg.png); }
if don't know how use stylesheets, insert embedded styling <head>
of html document.
<style type="text/css"> /* place css here */ </style>
if want can take step further , use css sprites (like old videos games used it). css sprites collection of images in 1 single image, , change position of location of background, , creates effect. can achieve this:
#myelement { background: url(my_bg.png) -0 -0; } #myelement:hover { background: url(my_bg.png) -0 -100px; }
there old school ways of hover effects they're frontpage-era, don't recommend using them. css hover effects standard of today.
Comments
Post a Comment