![]() |
||
|
|
Welcome to the Exploding Garrmondo Weiner Interactive Swiss Army Penis. |
GFF is a community of gaming and music enthusiasts. We have a team of dedicated moderators, constant member-organized activities, and plenty of custom features, including our unique journal system. If this is your first visit, be sure to check out the FAQ or our GFWiki. You will have to register before you can post. Membership is completely free (and gets rid of the pesky advertisement unit underneath this message).
|
![]() |
|
Thread Tools |
Painting using only XHTML/CSS, no images allowed
![]() What a nice picture, uh? Simple, but nice. Nothing too great. Well, think again. The above image is a screenshot of an XHTML/CSS page that uses no images to display; just divs, spans and a few dots. You can find the entry at my blog (spanish) here: http://metalize.liveonstyle.com/2007...ibujar-en-css/ And here's the actual drawing: http://metalize.liveonstyle.com/wp-c...-painting.html Check out source code. It's not as big as you may think. ![]() Hope you like! EDITWow... an painting... I'm ashamed. The subject was going to be "an image"... then I decided to use "painting"... and forgot to remove the "an"... My english is not as bad, I swear. Jam it back in, in the dark. |
That's pretty cool. I like. It's kinda like a 2D/3D image since it looks really polygonic. And the shapes aren't organic which is why the source code is probably so low, and the low ammount of colors used. But i've never really seen this done before.
![]() How ya doing, buddy? ![]() |
Very cool. I'd love to see more, if you ever feel like making some.
This thing is sticky, and I don't like it. I don't appreciate it. ![]() |
Perhaps I'll do anotherone sometime in the future; but for now I have some other projects and lots of work to do. :P
Glad you liked it! I am a dolphin, do you want me on your body? |
Wow, this is incredible...I never thought anything like this was even possible.
I didn't look too closely at your source (no habla Espanol ![]() Still trying to figure out how you did the mountain, though... Most amazing jew boots |
Yeah, the clouds, sun, rainbow, and the tree leaves are just stacked periods.
I'm definitely interested in the diagonal lines in the tree trunk and mountain. How'd you do those? I once made a picture kind of like this, except instead of drawing it in a web browser, it was in a mathematical graphing program. ![]() What kind of toxic man-thing is happening now? |
![]() FELIPE NO |
Somehow I'm reminded of Katamari, damn rainbow.
Most amazing jew boots ![]() |
Thanks for the comments!
As stated, the round parts you see are jsut stacked enormous periods. The diagonal lines are made by using a technique called "Slant borders". The theory of it is quite simple, but it's better explained through an example: Create a div. Now, set each border property through CSS individually, like this: border-top: 4px solid green; border-bottom: 4px solid red; border-right: 4px solid blue; border-left: 4px solid yellow; Finally, change the width of the borders and you'll see some pretty interesting stuff happening. Now, using transparent borders we can do stuff like mountains. ![]() Jam it back in, in the dark. |
Haha, that's clever!
![]() There's nowhere I can't reach. |
This is actually an interesting test of CSS and such. In Firefox 3.0a6-pre, part of the image renders wrong. It might even be a genuine bug in Firefox 3
![]() This thing is sticky, and I don't like it. I don't appreciate it. ![]() |
I am a dolphin, do you want me on your body? |
![]() How ya doing, buddy? |
I found this incredibly interesting and actually well done. Nice use of the border slant tech.
Do something else. Maybe slightly more detailed. =D How ya doing, buddy? ![]() |