dreamluverz collection
Let’s dream together

css: opacity

There’s an interesting site where you can use as a reference for opacity. You can check it here => http://www.mandarindesign.com/opacity.html

W3C SAYS
Opacity can be thought of conceptually as a postprocessing operation. Conceptually, after the element (including its children) is rendered into an RGBA offscreen image, the opacity setting specifies how to blend the offscreen rendering into the current composite rendering.

Name: 	        opacity
Value: 	        <alphavalue> | inherit
Initial: 	1
Applies to: 	all elements
Inherited: 	no
Percentages: 	N/A
Media: 	        visual
Computed value: The same as the specified
value after clipping the <alphavalue>
to the range [0.0,1.0].

<alphavalue>
Syntactically a <number>. The uniform opacity setting to be applied across an entire object. Any values outside the range 0.0 (fully transparent) to 1.0 (fully opaque) will be clamped to this range. If the object is a container element, then the effect is as if the contents of the container element were blended against the current background using a mask where the value of each pixel of the mask is <alphavalue>.

This example uses Mozilla proprietary code in conjunction with IE code. CSS3 is not fully defined as of today (August 2004). If you remove the -moz-opacity it will look like this.

Sample code:

fade{float:left;filter:alpha(opacity=100);-moz-opacity:1.0;opacity:1.0;}

Tags: css, opacity, opaque

css: button_link

an example of making your link looks like a button

.button_link{
border:#ccc 2px outset;
color:#000;
font-weight: bold;
padding:2px 5px 2px 5px;
margin:2px;
text-decoration:none;
}

view

Tags: button, css, link

cursor types in css

Possible Values

Value	Description
url	The url of a custom cursor to be used.Note: Always define a generic cursor at the end of the list in case none of the url-defined cursors can be used
default	The default cursor (often an arrow)
auto	Default. The browser sets a cursor
crosshair	The cursor render as a crosshair
pointer	The cursor render as a pointer (a hand) that indicates a link
move	The cursor indicates something that should be moved
e-resize	The cursor indicates that an edge of a box is to be moved right (east)
ne-resize	The cursor indicates that an edge of a box is to be moved up and right (north/east)
nw-resize	The cursor indicates that an edge of a box is to be moved up and left (north/west)
n-resize	The cursor indicates that an edge of a box is to be moved up (north)
se-resize	The cursor indicates that an edge of a box is to be moved down and right (south/east)
sw-resize	The cursor indicates that an edge of a box is to be moved down and left (south/west)
s-resize	The cursor indicates that an edge of a box is to be moved down (south)
w-resize	The cursor indicates that an edge of a box is to be moved left (west)
text	The cursor indicates text
wait	The cursor indicates that the program is busy (often a watch or an hourglass)
help	The cursor indicates that help is available (often a question mark or a balloon)

sources: http://www.w3schools.com/css/pr_class_cursor.asp
http://www.pageresource.com/dhtml/csstut10.htm

Tags: css, cursor

integrating “digg it” link with wordpress content

I’ve been working my butt around here juz to integrate this digg it link. I wanted it to float to the right with the use of different elements but still didn’t work. I tried different ways and at last I got it! I switched it. digg first then the content. It just need perseverance

Tags: digg it, digg it wordpress, integrate digg it, integrate digg it on wordpress content