CSS transparancy filter
I'm using the following CSS to create a transparent effect:
/* This is the transparent box for the foot */
#foot {
font-size: 10px;
background-color: #ffffff;
filter:alpha(opacity=75);
opacity: 0.75;
-moz-opacity:0.75;
text-align: center;
width: 225px;
clear: right;
margin-right: auto;
margin-left: auto;
/* This is the container which set text to solid color for
foot.
position: relative used for IE */
#foot div {
color: #000000;
filter:alpha(opacity=100);
opacity: 1;
-moz-opacity:1;
position: relative;
padding-top: 10px;
This works great in IE but only partially in FF and Safari.
<div id="foot">
container is transparent but the <div> inclosed by it
inherits the 75%
alpha. The div does not have the 100% specified in the #foot
div style.
Here is the HTML
<div id="foot"> <!--start foot -->
<div>Copy Copy Copy</div>
</div> <!--end foot -->
Like I said this works great In IE is there a fix for FF and
Safari?
Jeff
You can see it here:
http://www.margaretgordon.net/new/
In FF and safari the background is transparent but the copy
does not return
to 100% alpha.
So FF does recogonize the CSS but not my code to override it.
Of course IE does just what I ask.
Is there something I'm missing in the override CSS:
/* This is the container which set text to solid color for
foot.
position: relative used for IE */
#foot div {
color: #000000;
filter:alpha(opacity=100);
opacity: 1;
-moz-opacity:1;
position: relative;
padding-top: 10px;
Please help if you can.
Jeff
"BruceCSI2" <[email protected]> wrote in
message
news:f0j5ah$fu$[email protected]..
> This may be similar to the colored scrollbars, in which
they only work in
> IE, not other browsers.
Similar Messages
-
Transparent Filter Lists (Column Headings IR)
All,
I currently have the issue where the filter drop down lists appear transparent in my interactive reports. It is very difficult to read the list as it merges with the report data behind it.
I have found the fix in a previous thread but I am having trouble getting it to work.
Can any one tell me exactly where I should paste the below CSS tag?
+<style type="text/css">+
+.dhtmlSubMenu {+
background-color:#fff;
+}+
+</style>+
Version: 4.0.1
Theme 13
I am using IE8
ThanksThe Page Header (or the Page Template Header) is the right spot.
If you use Firefox with Firebug installed, do you see any errors? If you inspect that element (in Firebug) you can see if your css style is applied to that object. Might be very helpful to track down what's happening.
Or setup a tiny example on apex.oracle.com and "the world" can actually see what's happening and help you out!
I looked into it. As I see it the looks from the Filter drop down list comes from this piece of CSS:
#apexir_columnsearch, #apexir_col_values_drop, #apexir_rollover {
-moz-box-shadow:2px 2px 4px #888888;
background:url("../apex/builder/1px-white-trans.png") repeat scroll 0 0 transparent;
border:1px solid #AAAAAA;
font-size:11px;
overflow:hidden;
position:absolute;
width:200px;
z-index:1000;
So the background:url piece does the trick. You have to override that by adding your own style. Seems to have nothing to do with the dhtml... thing.
(btw: I have no trouble with this looks at all, I can see the data fine in FF, Chrome and Safari)
Edited by: Roel on Oct 22, 2010 2:54 PM -
I lack software that lets me save images with transparency in them, so I have to code something that will give my images transparency. Currently what I'm doing is having the part of the image i want transparent to be magenta, then I have a code that changes all magenta pixels into transparent ones. Here's the code I did:
public Image filter(Image img) {
BufferedImage b = new BufferedImage(img.getWidth(null),img.getHeight(null),BufferedImage.TYPE_INT_ARGB);
int filt = new Color(255,0,255).getRGB();
int repl = new Color(255,255,255,0).getRGB();
b.createGraphics().drawImage(img,0,0,null);
for (int y = 0;y < b.getHeight();y++) {
for (int x = 0;x < b.getWidth();x++) {
if (b.getRGB(x,y) == filt) {
b.setRGB(x,y,repl);
return createImage(b.getSource());
}..this code works great, but just a tad slow. I remember seeing somewhere that someone used a different class to achieve this easier. Does anyone know what it is? If not, is there an easier way to do this?
Many thanks. :EMS Paint (for Windows 2000 don't know about others, don't use) does support transparency.
Save the file as a GIF, then in
Image -> Attributes ( Ctrl-E )
use the "Transparency" & Select a colour for transparency.
Then download gif2png
then pngcrush
Or, if you have a lesser version of paint, download bmp2png
convert bmp to png, open in Microsoft Photo Editor, use the "Select Transparency Colour" toolbar button, click on the colour you want transparent, save, pngcrush.
Or finally write a quick Java app, I'm guessing untested, save as png/gif (using on of the methods above) then:
import java.net.*;
import java.io.*;
import java.awt.image.BufferedImage;
import javax.imageio.ImageIO;
public class Test {
public void main(String argv[] ){
try {
OutputStream outputStream = FileOutputStream( argv[1] );
URL url = new URL( argv[0] );
InputStream is = url.openStream();
BufferedImage bimg = ImageIO.read( is );
for( int x = 0; y < getHeight(); x ++ ) {
for( int y = 0; y < getWidth(); y ++ ) {
if( bimg.getRGB(x, y ) == 0xFFFFFF ) { // White pix
bimg.setRGB( x, y, 0xFFFFFFFF ); // white,
// full aplha
ImageIO.write(bimg , "png", outputStream);
}catch(Throwable t) {
System.err.println( t );
}All the paint applications you need. -
Vector vs bitmap, gradient/transparency/filter performance questions on ios
so i understand vector artwork is all done by cpu and drawn every frame and bitmaps can be loaded directly from ram using the gpu but when you have simple objects such a masks and static lines, is it more efficient to use vector graphics for a mask? or should it be a bitmap? what about a line, since it is just a graphic made using a equation rather then wasting resources on a large picture?
also when movieclips have filters on them such as bluring, it seems like it overlays multiple transparent copies of the image onto the selected movieclip. Does the cpu then have to multiply each colour of the transparent images to arive at the final blur? when i cache this as a bitmap and the edges are feathered/transparent does the gpu multiply the transparercies at the edges? or is it still the cpu that handles it?
I also wanted to know how stressing gradients are on the cpu/gpu, as a bitmap i assume it is treated the same as any other image but as a vector is it more costley on the cpu to have it up on the stage than an image?
if there is any tips for graphics on mobile devices i would love to hear them.so i understand vector artwork is all done by cpu and drawn every frame and bitmaps can be loaded directly from ram using the gpu but when you have simple objects such a masks and static lines, is it more efficient to use vector graphics for a mask? or should it be a bitmap? what about a line, since it is just a graphic made using a equation rather then wasting resources on a large picture?
also when movieclips have filters on them such as bluring, it seems like it overlays multiple transparent copies of the image onto the selected movieclip. Does the cpu then have to multiply each colour of the transparent images to arive at the final blur? when i cache this as a bitmap and the edges are feathered/transparent does the gpu multiply the transparercies at the edges? or is it still the cpu that handles it?
I also wanted to know how stressing gradients are on the cpu/gpu, as a bitmap i assume it is treated the same as any other image but as a vector is it more costley on the cpu to have it up on the stage than an image?
if there is any tips for graphics on mobile devices i would love to hear them. -
Drop Shadows | Again?
I know this has been disussed here on numerous occasions but
can someone tell me which method is being used on this website's
drop downs? How is the opacity achieved over the content below?
Adobe trade secret??
Rich> No url posted so just guessing.
I think OP meant Adobe's site, used "this" and
>Adobe trade secret??
They're on the web forum.
Jo
"Nancy O" <[email protected]> wrote in message
news:fs1d95$928$[email protected]..
> No url posted so just guessing.
>
> CSS
>
> .transparent {
> filter:alpha(opacity=50);
> -moz-opacity:0.5;
> -khtml-opacity: 0.5;
> opacity: 0.5}
>
> Html
>
> <div class="transparent">
> <p>your 50% opaque content here</p>
> </div>
>
>
> --Nancy O.
> Alt-Web Design & Publishing
> www.alt-web.com
>
>
>
>
> "RICH POW" <[email protected]> wrote in
message
> news:fs1b4u$72l$[email protected]..
>> I know this has been disussed here on numerous
occasions but can someone
> tell
>> me which method is being used on this website's drop
downs? How is the
> opacity
>> achieved over the content below?
>>
>> Adobe trade secret??
>>
>> Rich
>>
>>
>>
>>
>
> -
Using a fake semi-transparency - what's really possible?
Hi,
I'm just now moving into DW CS4 (from cs3) and I'm on an intel iMac. I'm trying to make a table background that is semi-transparent while KEEPING text and photos 100% opaque. I'm already familiar with this kind of code: (just improvising here):
.tableMain {
background: transparent;
filter=alpha(opacity=50);
opacity=.5
But this makes EVERYTHING semi-transparent - content and all. I'd love to know if it is possible to keep the content fully in view.
I've tried making a semi-transparent GIF or PNG background in Photoshop CS4 and using it for the table background, but that doesn't seem to work.
I did discover this (perhaps unique to my site) solution for a fake semi-transparency: Since I've got a gradient background on my site (see www.frankbright.com/History.htm ), I took a 'Screen Snapshot' of the background, from the bottom of the navigation to as far down as I could go. Then I used PS CS4 to expand the canvas and color down to cover my long pages. (See Jazz Links)
Then I used PS levels to darken the snapshot very slightly, so as to intimate a gray semi-transparent effect. Then I simply used that snapshot as the table background.
This looks better on the long, clearer pages that have only text content. With the index3 home page, however, you don't sense the semi-transparent effect I'm going for as much.
I've also noticed the 'Extensions' area of the CSS interface in DW - does this have anything to do with what I'm trying to do?
Anyways, I'm open to ideas, if anyone could suggest any.
Many Thanks, Frank B.Hi
You did not say what the problem was.
others viewing this thread. please read -
As for the colors of the background gradient using IEFilters, (for those who did not know on the forum, the IEFilter for background gradient was available since IE4.5, circa 1996, and all filters since IE5, circa 1998) you will need to adjust these as required. Luckily enough most background gradients go from one color to white or a lighter color of the starting color.
For FF and Safari see - http://hacks.mozilla.org/2009/11/css-gradients-firefox-36/, http://webkit.org/blog/175/introducing-css-gradients/.
Google Chrome uses the webkit declaration, but unfortunately Opera does not support the feature, (use a standard background color at the beginning of the declaration) and FF only from version 3.6. But with the upgrading for FF users normally being 70+% within 6 months, this does mean that 85% of users will support the background gradient.
PZ
Edit: If you are using a css reset then it may be worth placing the position: relative; statement in this, as these normally include all the elements from H1 to pre.
Message was edited by: pziecina -
Background color transparency?
Am I correct that at this time with CSS it is not possible to
assign degrees or % of transparency after you have selected a bkgd
color? It either has a color with no transparency or it is
completely transparent, right?
JAYsee the following two article/tutorials. They will tell you
everything you
need to know on CSS opacity, and how to implement it in
current browsers.
http://www.domedia.org/oveklykken/css-transparency.php
http://www.mandarindesign.com/opacity.html
Jeff
"LumberBisquit" <[email protected]> wrote in
message
news:fmlf05$sue$[email protected]..
> Am I correct that at this time with CSS it is not
possible to assign
> degrees or
> % of transparency after you have selected a bkgd color?
It either has a
> color
> with no transparency or it is completely transparent,
right?
>
> JAY
> -
How to Filter Initial Client HTTP Headers on a CSS11506 SSL module
Is there any way to filter the initial client headers on a css11506 ssl module ?? (software version 8.1)
This is one of the default options on the "old" SCA11000 appliances.Douglas, with an SSL module, the CSS can decrypt HTTPS traffic and see the cleartext HTTP traffic.
We can then apply any rules to the header.
I think in this case, the question refered to some data injected in the http header by the CSS and filter what data from the client certificate should be dropped or inserted.
We currently do not have this option on the CSS.
Gilles. -
How to do BrIghtness filter?
I see the filter panel but how can I apply brightness filter to my symbol?
You will not able to animate this filter value on the timeline,but you can code it.Below the the snippet which does that for you
var mySymbolInstance = sym.$("mySymbolInstance");
$({brightness: 1}).animate({brightness: 0}, {
duration: 500,
easing: 'linear',
step: function() {
mySymbolInstance.css({
"-webkit-filter": "brightness("+this.brightness+")",
"filter": "brightness("+this.brightness+")" -
Converted outlined text not distilling properly
I'm not sure if this is an Illustrator issue or an Acrobat distiller plug-in issue or even a font, if someone can shed some light I would be so grateful.
I'm using the Mac CS3 design standard suite and the type family I'm using is Avenir on my MacBook Pro at home and a CS2 on a PC at work and the same issue happens on both platforms.
My newspaper only wants ads that are saved is a press optimized pdf with all type made into outlines.
When I view the text conversion in Illustrator's preview mode, all the text look accurate; all the I's and L's are outlined rectangles.
When I save the file as a pdf, with the press optimized setting and then view it in Acrobat, the I's and L's looks strange. When print to my proofing laser the kerning between the any i or l character is increased.
I will open this pdf in Illustrator and turn on the preview mode, Inotice that the I's and L's are no longer outlines but are now are two points (a vector stroke).
Any users out there have a solution other then manually creating I's and L's with the rectangle tool?I outline text by highlighting the text and then select the Create Outline command under the Type pull-down menu. Never thought of flattening - the document only had two text blocks on one layer on top of a layer that had a placed tif image and a logo (that was completely vector art); I usually only use the flattening command when I use the transparency filter.
Thanks for the tip Wade, I'll try the Flattening with outline stroke checked first and see if that works. -
Error in Explorer "is_ie55up has no value"
Hi, experts!
I was changing css and backgrounds and login pictures, when noticed that login screen in Explorer can't open correctly. The same works in Mozilla Firefox. Explorer can't display page correctly, so it give a message about "is_ie55up has no value". Looking in the html-code of that page I saw:
</script>
<style type="text/css">.shadowBottom {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='Missing_sdw_horz.png', sizingMethod='scale');}
.shadowRight {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='Missing_sdw_vert.png', sizingMethod='scale');}
.shadowCorner {filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='Missing_sdw_corner.png', sizingMethod='scale');}</style><title>Oracle Business Intelligence Login</title><link href="Missing_logon.css" type="text/css" rel="stylesheet"></link><script language="javascript" src="Missing_browserDOM.js"></script><script language="javascript" src="Missing_common.js"></script></head>
<body>
<script language="javascript">function SAWLogonWait()
if(is_ie55up) {
document.body.style.cursor = 'wait';
if(document.styleSheets.length > 0)
document.styleSheets[document.styleSheets.length-1].addRule('INPUT.SAWLogonInput','cursor:wait');
return true;
I was surprised with the links src=Missing_common.js and src=Missing_browserDOM.js because there should be browserdom.js and common.js.
Please, give me a prompt how this login html composes (and pointed section)? Could it be the incorrect saw.dll behaviour or some *.xml *.js files have incorrect instructions? Any idea? T__TThat is something that SVN inserts into a file when it tries to merge its version of a file.
Simplest thing to resolve this which i tried doing was ...
remove any characters "<<<<<<< .mine" or similar from the file that you will see in your project object folder namely
<Projectname>.csproj.FileListAbsolute.txt
which contains a list of all the paths and recompile ...it worked for me
You may should read more at
http://tortoisesvn.tigris.org/faq.html -
Browser player doesn't display my site as it is built in Flash?
I"m using FlashCS3 I am developing a site. When I run the swf file using "test movie" or even by going to the folder containing the .swf file and not through the Flash program it plays perfectly as I want it look. But when I upload it to the site and hit it with my browser it doesn't display the same way???
In fact the browser shoes a background that I replaced with the partially transparent filter effect you see when played locally?? I have looked all through my movie clips and can not find where i tcould insert the old background?
I have made some snaps of what it looks like when played through the player outside of the flash editor (but this is the same as when played through the editor) and another pic of what it looks like on the web.
I am using Actionscript 2.0 mode for publishing, Flash player 8 or better, Bottom Up with compress movie and export hidden layers checked.ok i found the solution here by deleting the corrupted library
http://portablevideo.blogspot.com/2008/12/music-player-database-problems.html
now one of these below is for the music and one for the photos and i didnt have a problem with the photos but did it anyways and now the player can see my music:
these are the files that need deleting in order to get rid of the corrupted library.
Storage Drives: (Mass storage E, Memory Card F)
\private\101ffca9\harvesterdbvx_x.dat
\private\10281e17\[string]mpxvx_x.db
\private\10281e17\[string]pcvx_x.db
TIP: Connect the device in USB mass storage mode (File Transfer), to locate the private folder from the PC.
TIP: STRING and x_x will change depending on your phone. (my files had slightly different names than above on the n97) -
I have finally finished my lightbox
I finally got my LB working in IE
i had to sacrifice the fade in effect and give IE its own code for many things.
anyway 2 problems remain
perhaps someone ca give suggestions
1)
in the corner of the faded area the corners dont quite line up with the sides and top properly (notice the thin white lines)
what could be causing this?
2)
this only applies when the browser is not IE
SOMETIMES when you open a lightbox the image appears fully visable for an instant, then vanishes and the fade in effect starts.
when i first made the lightbox this ALWAYS happened, so i figured it was because the lightbox was fuly visable before the JS activated and so it did not "start" as being invisable before the JS activated.
So i used CSS to set the LB to be invisable when the page loads (transparent invisiable and not just display:none invisiable) and added a JS to the close links which render the lightbox fully transparent again so that the problem would not re-occur when the user opened a second lightbox (this is done over a period of zero miliseconds so that the user should not be able to open a second LB before it has compleated)
Now the problem never occurs the first time a lightbox is opened after loading the page - i take this to mean that my CSS transparancy startup works fine
however it SOMETIMES but not always happens on subsequent lightbox loads. - I take this to mean something is wrong with my JS fade out effect, but why does it only sometimes happen?
can anyone tell me why this may be happening?This is a fool (no pun intended) proof way of getting a lightbox onto your pagehttp://www.adobe.com/cfusion/exchange/index.cfm?event=extensionDetail&extid=2127022
I hope this helps.
Ben -
New/Updated free plugins for FCE
A couple of new plugins are available for free in my Final Cut Express/Pro Effects and others have been improved in their use of alpha channel, composition methods, and precision in object sizing (both new and updated plugins have a NEW flag in my welcome page).
In addition I added a set of (well so far only 3) plugins I labeled "toolbox": they do not really help in editing, but help in understanding how editing works:
- Channels displays selected color channels (either RGB or YUV) including alpha channel
- +Field Selector+ displays selected fields of each frame (either field 1 or 2 or both... side by side): it turned out to be a very valuable fxscript debugging tool
- +Value Tester+ displays values of selected fxscript variables: quite cryptic for non fxscript programmers...
Among the "standard" plugins a new entry exists: +Make Transparent+. This is quite simple and useful when applied to the masks made available by FCE (e.g. the generators in the Render or the Shapes bin).
+Make Transparent+ simply changes the white areas in the selected mask into transparent areas and black areas into opaque areas (or viceversa). The mask with the Make Transparent filter now may be simply superimposed to the clip... see the examples in my web page.
I hope these are also useful to my friends in this forum.
I'll be glad to read comments and suggestions...
PieroThank you for making your hard work freely available to us.
Ross Hunter
Orange, VA -
I've created a few websites previously, and I've been attempting to improve on them each time. I found this image, for a website I really liked the design of:
http://premiumtemplate.org/it-therestaurant-joomla-template.html
However despite trying different methods I really don't know how to go about creating something similar.
Any help would be much appreciated,
Thanks,Tm-Butler wrote:
Okay,
I can create a background image to use, however I'm not sure of the best method to place it as the background
And while I can create the features on the page I have no idea how to add the transparancy and put them on top.
You do have a ways to go, but if you are interested in learning then you are on the right path.
Creating a background is one step, but implementing the background is another. When you design something it is a fixed size, so depending on the resolution of the screen will depend on what your user's see and how they view the page. So do you need regions to repeat?
As far as transparency is concerned, you can do CSS transparency which is only available in newer browsers or use PNG transparency with images. The PNG method will work in IE7 and newer, but if IE6 is a concern, then users won't see the transparency.
A good tutorial to read over is the following: http://www.adobe.com/devnet/dreamweaver/articles/dw_fw_css_pt1.html . It is a good explanation of how to turn a design into HTML and the process that goes into it.
But as gramps said, we need to see what you have going on and where you need help. Think of users here like teachers, here to guide you to your answer.
Maybe you are looking for
-
How can I use Boot Camp in Mountain Lion to mount Windows XP?
I would like to use Windows XP on my 2009 13" MBP in Boot Camp? I have tried and it only asks for Windows 7 and when I use XP it says unable to install. 1. Is this usual? 2. If so, is there a work around? I do not have Windows 7 nor will I purchase i
-
Not only is photoshop, are all that is installed in my computer. I need the programs for college studies, for I Design. Help me please.
-
I am using the current version of Numbers (3.2). The problem I am facing is that it seems to be impossible to export a spreadsheet with invisible grid lines to a PDF. Every time I do so, thin (I guess 1px) grid lines appear in the PDF where the shoul
-
I need to access PC (XP) files from my mabook pro. The Mac connects via the SMB and shows the shared folders, but says cannot connect when you try to look in a folder. Also the SMB is not asking for a password to access PC, have set one up
-
This is going to be great stuff once the bugs are worked out. 8) Given a simple table: CREATE TABLE MY_DOCUMENTS ( ID NUMBER, CONTENT XMLTYPE Can anyone explain to me why: SELECT CONTENT.getStringVal() FROM MY_DOCUMENTS; ...gives me: ORA-00904: "CONT