Problem with flash and displayed div - html

Flash banner block up authorization div.
Currently it looks like:
http://img220.imageshack.us/i/zaslon.jpg/ http://img220.imageshack.us/img220/2623/zaslon.jpg
I want it to be:
http://img171.imageshack.us/img171/919/screen3e.jpg http://img171.imageshack.us/img171/919/screen3e.jpg

I can't give you the exact answer but it will involve the z-index and positioning something relatively and making sure you flash has the wmode set to transparent or opaque

A detailed solution can be found here.
And if you use jQuery you can also use bgIframe plugin to avoid that in IE6.
Hope this helps,
Sinan.

Related

How do you know the location in pix

I'm going to try and ask this the best way I can so sorry if I am not clear.
I am trying to learn css and html.
When it comes to positioning a image, for example top: # px;, how do I know what the pixel location is? Is there a program for that or is it a guessing game?
I hope you can understand my question. Thanks
Knowing the position of a element just by using CSS is not possible. This can be done using javascript. Check this link1 and link2.
If you know jQuery, it would have been more simpler.
Just use .offset().
is there a program for that or is it a guessing game?
You can also guess the position of an element when you assigned fixed dimensions to all the elements in your layout.
If you're trying to use the CSS top property in conjunction with display:absolute or fixed, then yes, it's mostly a guessing game. You can use browser addons to adjust your CSS so that you can see your element being positioned as you change it, get an IDE that supports live updating or previewing, or take a screenshot and measure the pixels yourself.
Normally, however, you shouldn't be placing elements this way. Just let the DOM do it's thing, and use padding and margins to put things into the right place. It takes a bit of trial and error to get things visually appealing, but it really isn't so bad.

HTML5 Particle effect

I am trying to create a similar effect as seen here:
http://timothypoon.com/blog/2011/01/19/html5-canvas-particle-animation/
However, I can't seem to get this to work on my page and I would like to apply this effect in a div that contains an image. Is this possible or does everything have to happen on the canvas?
When I try to recreate the effect described in the tutorial I get lots of errors such as variables not being defined etc.
You could re-create this using Canvas, or using CSS transformations and shadows, or a mixture of the two. As for the undefined variables, I can't help as you've not posted your code.
A clean approach would be to do everything within the canvas, using JavaScript. You can draw both the foreground grass, and background mountains to the canvas. However if you want to partly use a <div>, you can overlay the div on top of the canvas using CSS position:fixed or position:absolute, also using CSS z-index to set their order.
I recommend the following link, scroll down for the image drawing:
http://thinkvitamin.com/code/how-to-draw-with-html-5-canvas/
I don't know how else I can help, as the tutorial that you've provided explains everything quite well. But if you've got any further queries, feel free to comment, or update your question.
You can use the proton particle engine easily achieve the effect you want, Its API is very simple.http://a-jie.github.io/Proton/

CSS3 Page Curl Shadows

I'm trying to give the footer of a webpage I'm designing a css3 page curl shadow effect. I've found guides online and I think I've mostly modified the code to my situation, but I'm still having some problems. When I set the before and after to position: absolute (like the guide does), it makes my footer's background/background color disappear.
Here's a link to the jsfiddle: http://jsfiddle.net/a9ns7/1/
Any ideas?
If you're willing to employ jQuery, there is a useful plugin for applying interesting corner effects on elements...I'm sure you could work on this to make it seem like a page turning.
Found out I just needed to add a defined width to the footer_container div. Thanks for the answers.

Clicking through a transparent .png

First off, I would like to say that myspace is a pain. But, musicians love it, and I can make some money doing layouts for them. I overlayed a layer of .png's over myspace's original look, but need to utilize the myspace music player. So, I made a picture frame that surrounds the myspace player that has a transparent center so you can see the myspace player. unfortunately, the player doesn't have full functionality. It seems to respond correctly when I hover, but not when I click. does anyone know how to solve this problem?
You can see what I'm talking about here: myspace.com/gprettydesigns
add
pointer-events: none;
on your overlay to alow click events to pass through it. It's a fairly recent property so not all browser may understand it.
More informations on pointer-events on https://developer.mozilla.org/en/css/pointer-events
The best way would generally be to slice the image up into pieces and place them so that nothing overlays the music player.
Maybe you could use z-index to position the image underneath the player, more on this here: http://www.echoecho.com/csslayers.htm
Put the background image on a div then use z-index to position it behind the player. The advantage of putting a background image on a div and using z-index is that it'll be faster than using an actual inline image.
Clap clap clap to you! I've done sone MySpace tweaking and know it's a real PITA.
Change the CSS here:
#shell {
visibility:hidden;
z-index:200;
}
I don't remember if this is feasible or if they only accept inline CSS.
Not really question related but now you can also have bandpages on facebook via RootMusic. MySpace will probably be overrun in no time so I would also give them a look.
Good luck dealing with the spaghetti tables of MySpace.

html help frameset

I'm working on my html project, and everything is going well.
Now I'm doing the same project with framesets, but I discovered that the page in a frame set won't scroll as a whole page (you can only scroll each frame at a time).
How can i solve this?
Please help
It sounds like what you want is perhaps a static design around your scrolling content, correct?
If so, what you should actually do is make a single page (not a frameset) with your desired DIV layout (a good example can be found here), and then have your content div use CSS that will allow it to scroll (e.g. overflow:scroll;).
Hope this helps.
Don't use frames! I know this is a horrible answer to your question, but believe me - loads of peeps would agree!
If you can, use plain ol' CSS and NO FRAMES.
Also, there is rogue synchronised scrolling Javascripts floating around on the Interwebs - But I wouldn't use them. People who have Javascript off won't get that effect.