jQuery function call not working - Newbie Q

Question

The idea is to create a square thumbnail defined by whether the height or width is greater. It simply is not doing anything. Can someone please point me in the right direction?

Thanks

Dan

function galDisplay(){
 var galSingleImgH(this).height();
 var galSingleImgW(this).width();
 var galSingleImgWSum(this).width()/2;
 var galSingleImgHSum(this).height()/2;
 if(galSingleImgW > galSingleImgH){
 jQuery(this).attr('style','height:63px;width:auto;margin-left:50%;left:-'+ galSingleImgWSum +'px;');
 } else {
 jQuery(this).attr('style','height:auto;width:63px;margin-top:50%;top:-'+ galSingleImgHSum +'px;');
 }
}
jQuery('.rhsGallery .notFirst a img').galDisplay();

• ggdx: Yes- there are 3 images that it should affect and it's within the (document).ready()

Answer 1

Your variable definitions are wrong, use this instead:

var galSingleImgH = jQuery(this).height();
var galSingleImgW = jQuery(this).width();
var galSingleImgWSum = jQuery(this).width()/2;
var galSingleImgHSum = jQuery(this).height()/2;

• ggdx: Well spotted - That fixed it. Thanks Veger!

Answer 2

galDisplay is a global, not a method of jQuery objects. See the jQuery documentation of plugin authoring.

It looks like changing

function galDisplay(){

to

jQuery.fn.galDisplay = function (){

should do the job.

You will also need to fix your syntax errors.

var galSingleImgH(this).height();

should be

var galSingleImgH = this.height();

... and so on.

Answer 3

I think you forgot some =s on the upper 4 lines: (oh, and wrong way of calling galDisplay())

function galDisplay(){
 var galSingleImgH = (this).height();
 var galSingleImgW = (this).width();
 var galSingleImgWSum = (this).width()/2;
 var galSingleImgHSum = (this).height()/2;
 if(galSingleImgW > galSingleImgH){
 jQuery(this).attr('style','height:63px;width:auto;margin-left:50%;left:-'+ galSingleImgWSum +'px;');
 } else {
 jQuery(this).attr('style','height:auto;width:63px;margin-top:50%;top:-'+ galSingleImgHSum +'px;');
 }
 }
 galDisplay(jQuery('.rhsGallery .notFirst a img'));

Answer 4

To start with, your code is wrong:

var galSingleImgH(this).height();
 var galSingleImgW(this).width();
 var galSingleImgWSum(this).width()/2;
 var galSingleImgHSum(this).height()/2;

This won't ever work. I'd advise you to use Developer Tools to see this error in your browser.

It should be:

var galSingleImgH = (this).height();
 var galSingleImgW = (this).width();
 var galSingleImgWSu = (this).width()/2;
 var galSingleImgHSum = (this).height()/2;

Secondly, if this doesn't correct things, can you include your rhsGallery HTML in your question?