5 Comments

If you want to alter an elements CSS width or height, you must first convert this value to an integer, because the CSS value can have units like px, cm etc.
To convert this value to an integer in javascript, use:

        // Convert a css px value to int.
        function ConvertCssPxToInt(cssPxValueText) {

            // Set valid characters for numeric number.
            var validChars = "0123456789.";

            // If conversion fails return 0.
            var convertedValue = 0;

            // Loop all characters of
            for (i = 0; i < cssPxValueText.length; i++) {

                // Stop search for valid numeric characters,  when a none numeric number is found.
                if (validChars.indexOf(cssPxValueText.charAt(i)) == -1) {

                    // Start conversion if at least one character is valid.
                    if (i > 0) {
                        // Convert validnumbers to int and return result.
                        convertedValue = parseInt(cssPxValueText.substring(0, i));
                        return convertedValue;
                    }
                }
            }

            return convertedValue;
        }

5 Replies to “How to convert a CSS px width or height value to int with javascript”

  1. Simple parseInt(cssPxValueText) function build in javascript will do. Funny functionality of that function anyway :>.

  2. function ConvertCssPxToInt(cssPxValueText){
    return parseInt(cssPxValueText.substring(cssPxValueText.length – 2, cssPxValueText.length));
    }

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Related Posts