Make my website partially transparent to show desktop behind the browser [duplicate] - html

I'd like to have the users desktop or whatever windows they have open show through the background with a slight bit of opacity. I did a quick mockup in photoshop to try and illustrate what I'm aiming for
I'm fine with using a bit of jQuery if need be, but would prefer to keep the foot print light. I don't really want to add a ton of overhead just for a fancy effect.

No. You cannot make the browser window translucent.

This is completely impossible... using current APIs. It's theoretically possible that one might be implemented in the future, but for now, the best you can do is transparency to the user desired color.

I doubt this is possible since it requires the actual browser window to be transparent, which is almost surely not the case.

Maybe with some plugin for the browser, but not by code in your website.

No, this is impossible.
99.99% of the time, if you've never seen it before, there's a good reason*.
*EDIT: These comments are specific to web programming... not meant to apply to the sum total of human innovation.

The term is Form Opacity, and you have to have access to the applications source code, in most cases to manipulate it. Several programs already have this as a standard or hidden feature, i.e. Trillian, and iCalenderLite, to name a couple.... Windows 7 allows you to do it to any open window.
form.opacity
EDIT: Answer has been getting downvoted without comment, so I added the OP's and my additional remarks here.
Would this still be out of bounds for a website to change though? FREX I couldn't have my website turn form opacity on (just for site X) if it wasn't already? – aslum Jun 7 '11 at 23:33
For that, I would have to say "not possible", unless it was a "live" control, loaded by the browser to begin with. You most likely would not be able to do it on a "by site" basis only. And even though most user initiated events are "technically" replicable via script or code, proper security levels, would render such an event, inaccessible to outside manipulation. – tahwos Jun 8 '11 at 22:04

I am seeing a lot of this is impossible. The correct answer is currently mostly impossible ;) Using programming, you can create a window or application that is transparent. I have never done anything of the sort, but I have used several programs that allow you to control transparency.
My best bet for controlling opacity of a window is DirectX. So If you were to make a browser with DirectX, you could control the opacity of the window by reading the CSS.
So basicly, you could do it your self, much like mozilla firefox reads their own css (-moz-radius) just make your own DirectX based Web browser. I could see someone getting a lot of support on a project like that.

Related

UI design for Microsoft Access - what is possible?

I'm a graphic designer/web-UI designer by trade but have some (albeit limited) knowledge of Access. I haven't used it for a few years now but have been asked by a company to redesign the front end of their split database that was built using Access 2010. They had a programmer design the whole database, and it works well, but they do not like the actual appearance of the front-end so they have asked me to update it with some 'modern design' so-to-speak (i.e. stylise the buttons, fieds etc.)
I'm just wondering, what options do I have with this? Is there any way to use CSS as such to stylise the front-end? Or is there any built-in design tools that are useful? I plan to produce concepts using Photoshop to show them but it's knowing the limitations of what can be done with Access in terms of the front-end design. Any help would be appreciated!
It can be done, but it's a major task because Access isn't designed for developers (not to mention graphic designers) but for superusers. Thus, tools like you have in, say, Visual Studio, you can only dream of.
But if you are prepared to spend hours with alignment near pixel level, it can be done - as you may get an impression of from the screenshots here:
Modern/Metro style message box and input box for Microsoft Access 2013
Indeed, design of subforms is a challenge as these are offset a few pixels when embedded in the main form; if you are to accuracy to the pixel, this will hurt your eyes. Also, listboxes have a habit of shift their layout slightly when required - just to mention a few of the tasks you will encounter. In fact, once you have made some neat forms and controls, the only tool you have to ease your work, is to copy and paste these when you need a new form or control.
The icons are from the SyncFusion Metro libraray, colours are strict to the MS Metro/Modern palette, and fonts and proportions are as close to the Microsoft design guide as possible. This was chosen for two reasons: First, the design guide is so thorough and well thought out, and second, I had no reason to believe I could do it better. That may be different for you, of course.
The application was for a custom project, and users' response was positive only, even from Mac users (using Remote Desktop) - they love the colours.
Access is built to be GUI-intuitive. There's no 3rd party tools to "pretty" it up, only to improve the functionality.
That being said, there's plenty of stuff you can do to improve the look of it. Drop an Option Group down, delete the label, change the Special Effect to "Flat" and the Border Color to dark blue and you've got a nice little box to keep relevant controls grouped together. Utilize the Back Color of the form to give it a little more appeal; I always find a softer "slate" blue looks appealing and professional. White or soft yellow text looks nice on that background.
Add a label that stretches all the way across the top of the form. Make its background color a darker blue and center the text for a very appealing "header" for your form, or you can do the same thing inside those option groups I mentioned above.
Most coders I've ever worked with were pretty happy making dull gray forms with non-aligned textboxes and calling it a day. Take a little time to snazz it up with a few ideas I've given (and any you can make up yourself) and it goes a long way towards presenting an application that people don't dread using.
Here are few other UI components that "..are possible" without installation GitHubPage

Few Questions about PictureChooser Plugin

I'm trying to use the PictureChooser plugin, specifically the ChoosePictureFromLibrary method, and I have a few questions.
Is it possible to show more than just .jpg? I'd like at least .png as well, though maybe other picture types too.
Is it possible not to resize chosen pictures? The maxPixelDimension parameter seems to always resize the image to that size.
Is it possible to have access to the original file name of the chosen picture?
The PictureChooser is really quite a small plugin - it really only has one small class per platform - https://github.com/MvvmCross/MvvmCross/tree/v3.1/Plugins/Cirrious/PictureChooser
Because of this, the easiest route forwards for your specialist needs is probably to "branch" this small part of the code (by repo-forking or just by "copy and paste"). You should then find it straightforward to get hold of filenames, to avoid resizing, and to add any other features you need on the platforms you need to support.
If you create features that you think others may want, then mvx would love to see them open sourced back to the community - but that's not priority 1 - instead, the most important thing is making your app awesome and shipping it.

An overlay GTK toolbar/widget

I am writing a custom application in C using GTK+2.0 and Cairo. Just for learning purposes (and if successful, then for deployment), I wish to recreate something similar to a overlay toolbar/widget (I am sorry if the terminology is not correct) that appears when a mouse moves over a given area on the window, and disappears when the mouse moves away. The toolbar, as I imagine, should appear on top of the existing widgets without displacing them or altering the widget packing in any way. Is it possible to accomplish? If yes, can you please point me to relevant tutorials/examples and/or outline a way to do the same?
Thanks in advance.
Not sure this is easily doable in GTK2. However, I learned recently that there's the GtkLayout widget which allows pixel exact rendering of widgets, so you can even display some widgets over others. Or you may implement your own container widget.
Please note that since GTK3, there's GtkOverlay which seem to do what you want.
You may also give a look to Clutter, which might allow this. Furthermore, there are projects of merging GTK and Clutter for GTK 4.
The little known GtkHandleBox is capable of doing what you want. I must warn you it is deprecated in GTK+3 because is going against the usual UI direction. Also, the correct positioning will be subject to the windows manager quirks, so I'd expect some issue in this regard.

Add a tint/color to a submit button in IE8 via CSS while retaining "glassy" look?

I'm writing a web app. It's only ever going to be used with IE8, so I'm not concerned with the behavior of any other browsers here.
So: I know how to custom-style a button using CSS properties e.g. background-color, border, and so on. However, when you apply styles that way, the resulting button looks like a blocky table cell, nothing like the nice, glassy-looking button that IE8 renders by default.
Is there some way to add a tint to the nice glass-looking button? I.e., it looks just like it normally does, but with a red outline instead of blue, and a red highlight on mouse-over?
Or is this something I'm going to have to do by hand with images? Again, IE8-specific methods are perfectly acceptable.
Thanks!
-dan
There isn't really a filter that will get you as close to the default in IE, though you can get pretty close using the button tag and standard css. It will not look the same in all versions of IE though.
Here's the filter reference though if you want to try other things.
Regardless of browser, one of the quickest, easiest, most widely tested methods for styling buttons via markup is Jquery UI's button It's a matter of adding a few tags to the class element, and you've got a button based on an link, button, or input field. For styling, you can handle styling via CSS, or via the very well done ThemeRoller option, where you can control everything from text size to background type via a simple gui interface--and you can change on the back end or even the user end on the blink of an eye, even via drop down.
One caveat, since IE is non-standards compliant, rounded buttons fail gracefully to square--with proper styling.
I realize that you have determined that you can use a proprietary solution for IE, and in your case it might be just fine over the long term. But in my experience, that's a really dangerous path to follow. What if the actual long term is longer than your anticipated "long term?" You're specifying that it's acceptable to be proprietary to a browser that's well behind the accepted standards, is already a version behind, and uses unsupported (by universal standards) solutions to solve problems. Conceivably, that version is going to get tougher and tougher to find, and if Microsoft holds true to their patterns, once you install IE9 it will effectively render your computer difficult of downgrading. And, I can't emphasize enough that IE's market share is dropping like a rock, which is scary considering basically 95% of the machines out there have it pre-installed. All it's going to take is one overzealous IT director with "security in mind" to render your programming efforts moot. Sorry for the rant, but IE proprietary code has bit me hard more than a few times...
I'd have to double-check, but you should be able to use a combination of a background color and use a transparent PNG or GIF as the "background image" to add the highlights.
All things being equal, I've rather embraced the flat, square button - finding ways to make it work well with the design - but then again I've always been a straight line, square edge kind of guy. :)
As others have mentioned, you do want to be mindful (within reason) of what you may have to handle. It's quite possible that before the next re-write you're going to have to deal with IE9 - writing code that works well in IE8 and IE9 would be the most prudent approach.
Have a look at http://www.webdesignerwall.com/demo/css-buttons.html and also http://css3pie.com/.
Combining those you can get nice looking buttons in IE as well..

how many div's can you have before the dom slows and becomes unstable?

I am developing a jQtouch app and each request done via ajax creates a new div in the document for the loaded content. Only a single div is shown at any one time.
How many div's can I have before the app starts getting unresponsive and slow?
Anyone have any ideas on this?
EDIT: Its an iPad app running on Safari, and it would be less than 1000 div's with very basic content
I've had tens of thousands, maybe even a hundred thousand divs, on screen at once.
Performance is either fine, or bad, depending on:
Parsed from HTML or generated Dynamically in JavaScript?
Parsed from HTML means you have a LARGE html source, and this can make browsers hang. Generated in JS is surprisingly fast, even on Internet Explorer, which is the slowest of all browsers for JS.
To be honest, if you really need an absolute answer to this question, then you might want to reconsider your design.
No answer given here will be right, as it depends upon many factors that are specific to your application. E.g. heavy vs. little CSS use, size of the divs, amount of actual graphics rendering required per div, target browser/platform, number of DOM event listeners etc..
Just because you can doesn't mean that you should! :-)
As others have said, there's really no answer.
However, in this talk about the Google Maps API version 3, the speaker brings up the number ten thousand several times, as a basic threshold for browser unhappiness.
http://code.google.com/apis/maps/documentation/javascript/
Without defining a particular environment, it's not possible to answer your question.
And even then, anything anyone tells you is just a guess. You need to do your own testing on real-world configurations with different browsers and hardware. You'll also need to establish some performance benchmarks to decide what "too slow" even means.
I've been able to add several thousand divs without a problem. Depends on what you'll be doing afterwards, of course, and the memory on the client machine. Everyone else is right about that.
As Harpo said, 10K is probably a good ceiling. At one time, I noticed speed problems starting at about 4K divs, but hardware has improved since then.
And, as Neil N said, adding the divs via scripting is better than having a huge HTML source.
And, to answer Harpo's comment, one way to "break it up" so that JS doesn't lock the page and produce a "page is running slowly" error is to call a timer at the end of each "add a div" routine, and the timer in turn calls your "add a div" function again.
Now, MY question is: is it possible to "paint" so that you don't need to add thousands of divs? This can be done with the canvas tag with some browsers, but I don't think it's possible with VML (the excanvas project) on IE. Or is it? I think VML "paints" by adding new elements to the DOM, at which point you may as well use DIVs, unless it's a simple shape.
Is it possible to alter the source of an image via scripting? (the image in the DOM, of course -- not the original image on the server.)