Elements 8: Resize a square image

December 11th, 2009

I’ve mentioned that I’m really new to Elements 8. One of the things I needed to do was take an image, crop out a square section, and resize it to 100 by 100 pixels. I had a hard time doing this due to the default selections and my complete unfamiliarity with this editor.

If you have an image and need to resize it to a particular pixel dimension (I do it for LJ icons), you select a square portion of the large image by holding down the shift key and dragging the rectangle selector. Don’t look for a property of that tool to turn it into a square like I did; there isn’t one. Use the shift key.

Crop the image (Image –> Crop) to the square selection you chose.

To resize it, select Image –> Resize –> Image Size. When the dialog box comes up, you may not see a way to tell it the pixel size. This happened to me. It just wasn’t in the dropdowns for the units. Apparently, you need to select the two checkboxes “Constrain Properties” and “Resample Image”. THEN the pixels show in the unit dropdown. Go figure. Choose your desired size and you’re good to go.

It drove me batshit crazy looking for this, so I hope this helps someone. It’s both amusing and really frustrating that I find it so difficult to do simple things I’m used to doing easily in PSP…

Elements 8: Text border

December 10th, 2009

I recently started using Photoshop Elements 8. It’s a big change for me; I’m used to Corel Paint Shop Pro. So I’ll be posting some seriously newbie sounding tips about Elements 8 here for anyone else who is looking for these seemingly simplistic things, but had a hard time finding them.

I like to create icons for Messenger and LiveJournal for my personal use. I also rather love cat macros. So a common thing for me to want to do is to put a border around text. I had a really tough time finding out how to do this simple thing, because I’m used to other editors so I was looking in the wrong place.

To put a border around text in Elements 8:

  1. Create the text. It should end up on its own layer.
  2. From the top menu, select Layer –> Simplify Layer
  3. Select the text by holding down the control key and clicking on the text layer in the layers palette. Not the layer itself, but the little text in the “preview” next to the layer name.
  4. From the top menu, select Edit –> Stroke(Outline Selection). Use the dialog box to control the color, width, etc.

Hope this helps someone. I was looking all over for that.

QOTD: Who Am I?

December 8th, 2009

“Was I the same when I got up this morning? I almost think I can remember feeling a little different. But if I’m not the same, the next question is ‘Who in the world am I?’”

– Alice in Wonderland

jquery snippets

November 6th, 2009

Because I’m a total newb to jquery, but I love it already.


// hide element with ID #liModify
$("#liModify").hide();

// show element with ID #fldAttachment
$("#fldAttachment").show();

// toggle element wth ID fldModName (show if hidden, hide if visible)
$("#fldModName").toggle();

// uncheck a group of checkboxes named chkRequestType[]
// this group allows handling as an array when submitted, a common thing for php
$("input[name='chkRequestType[]']").attr("checked", false);

// select the first option in a dropdown list with the ID ddlOffice
$("option:first", "select#ddlOffice").attr("selected","selected");

// remove CSS class from all elements with class .error
$(".error").each(function (){ $(this).removeClass("error"); });

// add a CSS class to the label for an invalid element (form validation)
if ($("#ddlOffice").val() == "") {
isValid = false;
$("label[for='ddlOffice']").addClass("error");
}

// get the ID of the selected radio button of a group named "rbRequestType" that belongs to a form with the ID "theform"
$("#theform input[name='rbRequestType']:checked").attr("id")

// is the box checked?
if($("#chkRequestTypeModName").attr("checked") == true)

// focus the first element where its label has a class of "error"
var e = $(".error:first").attr("for");
$("#" + e).focus();

// most of the code (like the above) will go in the document.ready section, it's like the onload event for the document
$(document).ready(function() {
// put stuff here
});

javascript validation – not empty

November 6th, 2009

For text or textareas


function isEmpty (val){
regex = /^.*\w+.*$/m
return ! regex.test(val)
}

Example use (jquery)

if (isEmpty($(”#txtRequestorName”).val())) { // do something  }