Fix IE jQuery fading bug

OK, so you fade some element in/out, and test in Firefox and it’s beautiful. Open IE, and, whoa, wait, what’s that split second of super ugly? Bold text, just before fading, gets all, chunky, and blotted, and pixelated, for lack of a better description. Here is my simple solution: Read the rest of this entry »

GreenFlipFlops.com - LAUNCHED

GreenFlipFlops.com I am starting a business. Wrote a business plan, going to advertise, open a business checking account, the whole nine yards. Check out greenflipflops.com to see what’s happening!

Contact Congress About Gas Prices

OK, gas prices are out of control. Everyone is getting hit hard by these escalating prices: liberals, conservatives, and everyone in between. PLEASE CONTACT YOUR CONGRESS PERSONS ABOUT THIS. Ask what they are doing to stop this crisis. Push whatever agenda you can think of - flex fuel, hybrids, electric cars, alternative fuel, anything. Anything to end this downward spiral, something has to be done. How do you contact your representatives? In less than 5 minutes I was able to email both of my senators and my representative in the House. Here’s where you start:

Gas prices effect all of us, in nearly every aspect of our lives. Please do something about it. Get everyone you know involved. Now.

Sweet jQuery plugin

I fell in love all over again. Smashing Magazine did a post on Ajax scripts, and they included a real gem (I’m sure others are nice, but I haven’t played with them all yet.) Everyone loves rounded corners, but the strictly CSS method is cumbersome to say the least. As documented I love jQuery, and I had been using the corners plugin for a while (the main one, that comes up in a Google search on the matter.) It worked fantastically, and all was well. Until I found this plugin that accomplishes the same effects, and more! Finally, I can add easily borders to my rounded elements - SWEET! Much love to Jonah for this awesome plugin, I’m switching over to it immediately!

Firefox links not clickable

OK, this caused me severe aggravation. And I mean severe. I’m using jQuery, and the corners plugin. I make a nice header for a div, and float some icon links in the header to the right. Said header has the top corners rounded. I try to click on the links I mentioned, and nothing. Cursor does not change to the “pointer” like a link. That’s wierd. I try in IE (6 and 7), no problem. Great, this should be fun. Read the rest of this entry »

In-line Text Editing with jQuery Tutorial

This is my first “tutorial”, so bear with me, or even send me comments, if it totally sucks. I was playing around, and needed an inline editor, just for fun, not really because I needed it. I looked for an existing script, but didn’t see any I liked. So I made one with JavaScript/Ajax, PHP, and HTML. The short description of it: show the items in plain HTML text, but when clicked, turn the text into an editable text box, and save changes to it when the user clicks or tabs out of the box (yes, onBlur.) THIS IS NOT A PHP TUTORIAL, it’s focus is on JavaScript/Ajax, I’m trusting the PHP to you! Read the rest of this entry »

Cool New Addition to Site

The LizardOK, cool might be a stretch, but I think it’s cool, and I’m in charge here. Admittedly it’s sorta random, like the lime at the top right of my blog here, but I went ahead and added a lizard to my personal site. I was cruising stock exchange, looking for cliffs for some reason, I forget why now, and I came across this dude. I said “Self, wtf is a lizard doing showing up in my results for ‘cliff’? No matter, that is too cool not to put into play somewhere.” Of course I couldn’t think of a ‘professional’ need for a money-metal blue and orange lizard chilling on the rocks, so he landed on my site.

Here’s how I incorporated him:

  • Trimmed out the background in Photoshop
  • Gave the image a nice shadow in Photoshop
  • Made a new div in the bottom include .php file on my web pages, set the CSS so it was right-aligned, gave it a high z-index so it would be always on top no matter what size the screen/browser is
  • Dropped the image into said div
  • Hacked around accordingly so it works in FireFox and IE7
  • Punted for IE 6 (the image is a .png, and I need it’s transparency); I wrote some javascript to hide the div in this crap-tastic browser -  so IE6 users, you lose! But you probably hate this site already anyway since I use transparent png’s here, too, so you lose twice. Get a better browser!

Here is my final CSS code that worked in FF and IE7:

div#lizard{
position: fixed;
bottom: -20px;
right: 0;
width: 100%;
text-align: right;
margin: 0;
padding: 0;
clear: both;
display: none;
z-index: 10;
}
div#lizard img{
position: absolute;
bottom: 0;
right: 0;
margin: 0;
padding: 0;
}
 

The main div for the image has “display: none” and then I switch it to be visible in my javascript browser detection.