I’m trying to learn how to create and code 3D icons like this (image attached) they are also rotating continuously and in slow speed. Also the splash screen before you hit > Press Start. Here’s the website I’m referring to awge.com
I’m guessing it’s a lot of three.js and css? I’m still relatively new, so forgive me, lol. But I’d like to know how to learn this.
Related
I see a lot of designers that make shapes on the website. For example, a curvy purple line like shown in here: https://fiverr-res.cloudinary.com/images/q_auto,f_auto/gigs3/146762996/original/c5c40fc15550b852236414d3984f178e6b976e51/create-a-unique-and-creative-website-for-your-brand.png
My question is, assuming that I am a front-end developer and my boss gives me the files from the designer and asks me to implement this design into the website, how do I do that?
Is it just a one picture that I will get in many different width's and will have to use as a background and fit the text in with breakpoints?
Sorry if that sounds like a stupid question, but I always wondered about websites with weird shapes
For "weird" shapes you can always play around with the clip-path property. Mozilla's dev tools give you awesome ways to play around with it and create a customized shape
Not too knowledgeable on vector graphics but throwing together a website for a hobby and am using an SVG as a background image. Found a great image here that I'd like to use but I'd like there to be more whitespace above the mountains: https://www.svgbackgrounds.com/#flat-mountains
Is there an easy way to do this? I've been out of the web dev game for a bit now and simple searching lead me to "background-position:" and that pushes the image down but I end up with the bottom of my image coming down into the top of my screen. Is there an easy way to just add some whitespace here so that the mountains start a little lower?
Don't have the site live yet to show you or I would.
Thanks!
I need to recreate a flash animation from an old website. This is the Flash animation:
http://igz-inno-life.de/content/IGZ_Uebersicht.html
In the past I would have used Javascript and transparent PNGs to switch between different layover images but in these times of HTML5 I'm sure there is a better way to to this.
I have already done a similar thing with css layers - but in that example all that was required was differetly sized circles and here the layers are a little bit more complicated.
Is there some new HTML5 method to replicate these layer effects or would CSS layers be the most comfortable way to go?
Thanks a lot!
It doesn't seem like it would be very difficult to recreate the Flash file from scratch with only html and css (as long as you have the original assets). But if you want a quick easy way you can try just converting it with Google's Swiffy.. https://www.google.com/doubleclick/studio/swiffy/ .. you can upload the .swf file and see that it converts it pretty well.. a head start at least.
If you wanted to recreate it all Flash like you can take a look at Adobe's Edge Animate ( http://html.adobe.com/edge/animate/ ) .. you can build it up almost just like Flash.
Brian
I am messing around and created a neat web layout in Photoshop. I then sliced it up and exported all of the Images and HTML to Dreamweaver. However, it turns my layout into tables. This is a problem because I can't get it to fit all screen resolutions. Does anyone have a quick fix or some advice on how to get my slicing converted to CSS?
You aren't going to get an automated thing like that to work the way you want it to. It's why I started coding. When slicing your psd think about it in the layers it is in, then you will have to figure out how to css it all together. It's alot to learn, but once you get your awesome psd working as an active web page you will realize how worth it it was.
I am developing a website where i am using CSS based layouts with absoulate positions. I would like to know is there any plug in for IE 8 which will tell based on the mouse where i am moving with the position (In Pixels).
I want to know with out any JS. I am looking is there any external plug in which will allow me to find out the position.
Do you mean a plug-in for the browser that will show you the mouse cursor’s position, whilst you’re developing the site?
I haven’t heard of any plug-ins, but you might try Andy Budd’s layout grid bookmarklet.
Doesn’t quite give you the mouse cursor’s position, but might make it possible to make it out.