If you are not using Spoon, well…you should. It’s what I use to test in any freakin’ browser. I’ve wrote about it before, so go check it out. Anyway, Spoon’s Browser Sandbox added Firefox 4 Beta, IE9 Preview, and Chrome 6 Beta to its list. I had to take a look at FF4 Beta just to see what all the hype was about. Let’s talk about what I was able to see, shall we?
Anyone check out the design change over at css-tricks.com? Pretty damn nice, yes? I found its cleanness inspiring. So much so in fact, that I was an hour into changing my design here up quite a bit. If you wandered over here at the time, you might have noticed some of the changes. But while I was doing these changes, which involved a lot of deleting, I suddenly stopped to think things through. I then put most of what I was taking out, right back where I had them. Again, if you happened to be here while it was happening, you would have noticed that my slider was gone. Replaced by a simple header, a small lead-in on what the The Web Machine was all about, and another h2 tag that said some silly crap that I can’t remember. Why did I put it back though?
I can’t claim anything new with this, but I would like to show you how to use jQuery to build a very simple image gallery. This one really hit home on how important it is to think your way through what you want jQuery to do BEFORE you start writing the code. You will find that you get into trouble if you don’t.
Click here to see the demo.
Ten points if you can comment and tell me what HBO show that heading is from. Anyway, on to the code! I will leave out the css because it is really irrelevant. You can style your gallery however you want. This is just for demo purposes.
Everyone know how to fix the the double margin IE6 puts on an element that has a left/right margin on it, without using a hack? If not, it’s an easy one…set display to inline. That’s all it takes. Have you ever run into the 3px margin gap though? This took some hunting for me to find out how to fix it. If you have any idea of what I’m talking about, you will know how infuriating it is. A co-worker and I ran into this problem months ago, figured out how to fix it, and forgot about it. The problem came back, and we drew a blank. Basically, we are using a component that says “Hey, if a flash banner is present, use it, otherwise, use this image over here instead.” Well, when it puts the image in, it doesn’t give it a height or a width. Why would that be a problem? Because it doesn’t have ‘Layout’ according to IE.
I’ll give you the definition that I got from here: “Layout” is an IE/Win proprietary concept that determines how elements draw and bound their content…”.
I would like to be able to explain why this happens, but the link above does a better job of it than I ever could. I just want you aware of what happens. To better illustrate this, take a look at the link below in IE6.
Click here for demo (again, look at it in IE6 – you won’t see it in any other browser).
If you read my post yesterday, you know I installed Magento – eCommerce Platform. I have to say, after I actually got it it loaded an ready to go, it seemed more scary than it was. If you want to see what it looks like, take my rul and replace /blog with /magento. I don’t want to post a link, because I don’t want anyone trolling that isn’t reading this, and I got a ton of spam the past few days.
Not love, but my thought was, “Wow, this is a nicely organized admin panel (which you can see a screen shot of below). Seemed easy enough to understand from the looks of it. You would be dead wrong though, if you thought that. Which I did….and I was. I have played with it now for about 2 hours, which in all honesty, you will need to do also if you plan on using it. If you have never used an eCommerce platform before, like me, then there is some stuff that will confuse the crap out of you. Getting a new product to display was not easy. Why? Because you have to create a category, which has a ton of options to choose and fill out, to put the product in. Then you have to create the product, make sure you place it into the category, fill out pricing, tax info, and a bunch of other stuff. It took me an hour and a half to actually get 1 product up.
Coupon Code:
webmachine
