Nov 22, 2009

Transparent Scrollbars - Coding Transparent Scrollbars

free web hosting
Open Discussion > MODERATED AREA > Tutorials

Transparent Scrollbars - Coding Transparent Scrollbars

melancholy
Why woud someone want a Transparent scrollbars you ask? Well fist of they do not cover too much of the image like the normal scrollbars.

You can use transparent scrollbars for different kinds of web layouts such as popups, iframes, or scrolling div layers. For iframes, make sure you've inserted a background image for the table cell containing the iframe. You do not need to do that for scrolling div layers. Although, you cannot make the main scrollbar transparent unless you make it appear that way by selecting the same color for everything.

After you code the scrollbar colors, insert this code in the iframe or div layer tags. Replace transparent color with the color that will be transparent:

allowtransparency="true" style="filter: chroma(color=#transparent color)"

Allowtransparency="true" allows the background of your iframe page to be transparent. If you already defined a background image for your iframe page, you only need style="filter: chroma(color=#transparent color)".

It should look something like this:

Iframes: <iframe name="main" src="frame source" width=### height=### framespacing="0" frameborder="0" allowtransparency="true" style="filter: chroma(color=#transparent color)"></iframe>

Div Layers: <div id="iframe" style="position: absolute; top: ###px; left: ###px; width: ###px; height: ###px; overflow: auto; filter: chroma(color=#transparent color)" allowtransparency="true"></div>

Here is an example. See the scrollbar in the iframe? It is transparent!

Do some experimenting for different effects with transparent scrollbars!

 

 

 


Comment/Reply (w/o sign-up)

Saint_Michael
wheres the example a link maybe would help out

Comment/Reply (w/o sign-up)

NeXDesigns
seems like a useful tutorial but i want to see an example for it before i even go to try this. also what browsers does it work on? ie, firefox, netscape, etc.

Comment/Reply (w/o sign-up)



Got an Opinion! Express your Views! (no registration):-
Add your Reply/ Opinion/ Views/ Comments/ Suggestion/ Questions/ Queries etc.
Posts with decent grammar & English will be accepted and please refrain from profanities.
For asking a Question, We recommend you to sign-up (for free) so that you can track the topic easily.

Nature of your Post*: Opinion/ Reply/ Comments
Question/Query
Feedback to us.
       
Name   Email
Title/Question*

This textarea will convert to Rich-Text automatically (IE, Firefox, Chrome)

Similar Topics

Keywords : transparent, scrollbars, coding, transparent, scrollbars

  1. Nice Clean Php Layout Coding.
    Learn a nice neat way to code your layouts with php (7)
  2. Make A Transparent Picture
    (4)
    Ok. I'm gonna use a free program called paint.NET. It's a really good program to use. This
    can be done with other *expensive* programs, but if you wanna make your own and don't have paint
    shop pro or anything like that then I recommend using this! Link to download paint.NET: click this
    link If you play neopets or anything this a cool thing! So you can use it for your userlookup,
    your shop, gallery etc... Ok...so enough about that. Let's start! /tongue.gif"
    style="vertical-align:middle" emoid=":P" border="0" alt="tongue.gif" /> 1. FIND a image you ....
  3. Image Gallery Tutorial Using Hoverbox
    A php solution to coding the Hoverbox Image Gallery (15)
    As reported in another posting , there is an Image Gallery named Hoverbox from the Sonspring site
    which is a pretty cool display method using CSS to have Thumbnail pictures double their size by
    hovering over them. I liked the css included in the original Tutorial as found on the Sonspring
    site , but I knew there was more than one use for the Hoverbox and took it upon myself to explore
    the use of the Hoverbox on a site I webmaster. One thing that wasn't right was having to
    hardcode the image tags, so the first version I wrote used php to fill the Hoverbox by rea....
  4. Php Installed Modules Dynamic Reference Tool
    An effective tool for coding in PHP (4)
    PHP Installed Modules Dynamic Reference Tool A dynamic tool for referencing PHP modules and
    their associated routines, which are installed on your web-server. **Note: Uses only 2 functions
    built-in to PHPs core and should be easy to convert to a later version of PHP. This current version
    uses PHP4. Example: PHP Installed Modules Dynamic Reference Tool Abstract : As a PHP
    Developer, it is nice to know what functionality is available to you, and what you would have to
    implement yourself. Some of this functionality is provided for you by the PHP core,....

    1. Looking for transparent, scrollbars, coding, transparent, scrollbars

Searching Video's for transparent, scrollbars, coding, transparent, scrollbars
See Also,
advertisement


Transparent Scrollbars - Coding Transparent Scrollbars

Affordable Web Hosting, Low cost Web Hosting - ComputingHost.com