I'm an aspiring entrepreneur currently teaching myself how to code in order to build a MVP for a product I've fully mocked up in Illustrator and see a huge need for. This idea came to me when learning about the :hover pseudo class in CSS. I basically just created a bunch of divs for each "pixel" element with height/width of 25px and transparent background, absolute positioning in %, then set the :hover class of each div id with a url of the background image and the specified height and width.<p>I figure this will be a cool "sandbox" for me to play around with as I continue learning. I haven't yet reached Javascript (done w/HTML _for now_ and nearing completion of CSS), but when I do I imagine there will be some more cool effects I can add.<p>Anyway, feel free to comment or offer suggestions for resources that may help me along the way as I learn to code. I know the site is bush league (the title is intentional btw) but even a journey of a thousand miles begins with a single step. And hopefully it will put a smile on the faces of a few Star Wars fans :)
I'm an aspiring entrepreneur about 3 weeks into teaching myself how to code in order to build a MVP of a product I've fully mocked up in Illustrator and see a huge need for. This idea came to me when learning about the :hover psuedo class in CSS. I basically just created a bunch of divs for each "pixel" element with a height/width of 25px, transparent background, and absolute positioning %, then added a :hover class for each div with the background image url, height, and width defined.<p>I figure this will make for a cool "sandbox" as I continue to learn new aspects of programming. I haven't yet reached actual _programming_ (just HTML and CSS), but will be diving into Javascript soon and look forward to messing around with it some more.<p>Anyway, I welcome your comments and suggestions for resources that may help me as I learn to code. I know the site is bush league (the title is intentional btw) but even a journey of a thousand miles begins with a single step. Plus, hopefully it will put a smile the on the faces of a few Star Wars fans :)
I love it! Try looking into these things:<p>1. CSS Sprites: merge all of your images into one large image so when your page loads, it makes one request for the css sprite. When the right pixels are found by the user, your images will appear straight away without being pixelated as the CSS sprite would have loaded at the start so the web page will not need to load a new request<p>2. jQuery (javascript framework): This is a great JS framework that is easy to implement that will allow you to start displaying your images using "Star Wars" type effects! e.g. <a href="http://jqueryui.com/demos/show/#default" rel="nofollow">http://jqueryui.com/demos/show/#default</a><p>3. source control: if you want to get into programming, you should look into using source control to manage your code... even if you're starting off using html and css, it's good practice. Later on when you start doing some complex stuff, you'll find that it'll save your bacon more than a few times. I would recommend using git because all the cool kids are<i></i><i>. Just sign-up for a free account at <a href="http://github.com" rel="nofollow">http://github.com</a> and you should be right with their great documentation<p>All the best,
Star Wars fan at heart!<p></i><i></i> i dont want to get into a git vs svn debate here so I won't even begin to list reasons for my preference