2

I'm trying to use jQuery to pass a height to colorbox. Doing so, the only way I can think to define the height is through the links 'class'. So I'm trying to figure out how to get the number from a string; e.g;

class="height_900" ; I want it to get the number, '900'.

Is this possible with jQuery?

MORE INFO: Ok.. So here's what I'm trying to achieve.

I'm creating a Wordpress Shortcode for colorbox (variation of lightbox). Colorbox sets its height and width via jQuery.

The Wordpress shortcode contains the attributes 'height' & 'width' that allow the user to set both manually if they wish. The problem is, I cannot figure out a way to pass these PHP variables to the colorbox jQuery.

The best solution I could come up with was to have a class that goes as follows: height_$height; e.g. height_450. I then wanted to get just the number via jQuery, then it uses that as that specific colorbox's height. Same for the width.

Improve this question
5
  • There is probably a better way to do this. What do you mean by "passing a height to colorbox"? Are you using a colorbox plugin? If so, I imagine you could pass in the height via an option. Another possibility is to attach the height to the element via the data() function. Commented Dec 21, 2010 at 18:54
  • straightforward javascript. split() Commented Dec 21, 2010 at 18:54
  • This is a simple parsing question, and doest not really pertain to jQuery itself. jQuery is a library for manipulating DOM elements. You would use javascript to parse. Commented Dec 21, 2010 at 18:54
  • Passing a height value via a class name seems a very poor idea. If you must pass it as part of some existing attribute value, then "id" is probably a better choice. Commented Dec 21, 2010 at 19:00
  • @SRM: But it includes getting the class name which the OP would use jQuery for. Commented Dec 21, 2010 at 19:03

5 Answers 5

Reset to default
8

try this:

parseInt( className.split('_')[1] );
Improve this answer
Sign up to request clarification or add additional context in comments.

1 Comment

it's important to use the radix argument: parseInt( className.split('_')[1], 10 ). Try parseInt( '0100' ) to see why.
3 
$(<Selector>).attr('class').split('_')[1];

NOTE I don't do any error-checking. And what is it you're trying to do (more explicitly), there's got to be a better way.

Improve this answer

Comments

2

First of all in answer to your question. Make jQuery work for you. It has a .height() method which will not only return the current height of the box but allow you to set it as well (e.g. $("#someID").height( 200 ) )

Secondly: CSS should be used to describe a thing, not the attribute of a thing. What if you want to come back later and change the height of your elements to 700 instead of 900? You either have to leave them misnamed so you have:

.height_900 {
     height: 700px;
}

-Or- you have to change the class name everywhere you're using it. That defeats the purpose of CSS.

Instead name your class by what it is supposed to contain. Something like: .menuItem which allows anyone to know they would be changing the properties of your menu items.

Improve this answer

2 Comments

I know, but its the only solution I can come up with. I'm using a custom Wordpress shortcode which will allow the user to set the height via an attribute. This attribute (height) is then usable with the variable $height (PHP not jQuery). I'm then trying to somehow get this PHP variable value to the jQuery for colorbox. The best solution I can come up with it to use the CSS class like so: height_$height and then get jQuery to get the $height part of this (e.g the number).
@Matthew In that case why don't you just generate your style sheet from php. You can name the style whatever you want and embed the height value into that style from the php variable. Your stylesheet reference will point to the php page which will generate the correct styles and attribute values based on those properties. It will serve it up to the browser and you will get your styles without having to use jQuery.
1

Here is a good way using parseInt()

if(Stringname.substr(-3)==parseInt(Stringname.substr(-3)))
var b=Stringname.substr(-3);
else if(Stringname.substr(-2)==parseInt(Stringname.substr(-2)))
var b=Stringname.substr(-2);
else
var b=Stringname.substr(-1);

It checks and give the correct answer and store it in variable b for 1 digit number and upto 3 digit number. You can make it to any if you got the logic

Improve this answer

Comments

0

Late answer, but if you know the number of characters you'd need, I'd use .slice() instead:

"height_900".slice(-3);

This will give you the last 3 characters in the string.

If you want the result to be a number, you can use the unary + operator to convert.

+("height_900".slice(-3));
Improve this answer

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.