Welcome to Bucaro TecHelp!

Bucaro TecHelp
HTTPS Encryption not required because no account numbers or
personal information is ever requested or accepted by this site

About Bucaro TecHelp About BTH User Agreement User Agreement Privacy Policy Privacy Site Map Site Map Contact Bucaro TecHelp Contact RSS News Feeds News Feeds

JavaScript .big and .small to Change Text Size

The JavaScript String object's big and small methods can be used to change the size of text. A basic example of use of those methods is shown below.

<script>
var strTxT = "this is my text.";
document.write("<p>" + strTxT + "</p>");
document.write("<p>" + strTxT.small() + "</p>");
document.write("<p>" + strTxT.big() + "</p>");
</script>

Result:

In the example shown below, the big method is used to increase the size of a section of text within a string.

<script>
var strTxT1 = "text text text";
var strTxT2 = " text ";
document.write("<p>" + strTxT1 + strTxT2.big() + strTxT1 + "</p>");
</script>

Result:

In the example shown below, the document.write method is used to create a span element in the text string so that the exact size of a section of text within a string can be set. In the style code, the size of the font with the span is set to 24px.

<style>
p {font-size:20px;}
.big {font-size:24px;}
</style>

<script>
var strTxT1 = "text text text";
var strTxT2 = " text ";
document.write("<p>" + strTxT1 + "<span class='big'>" + strTxT2 + "</span>" + strTxT1 + "</p>");
</script>

Another alternative that can be used to change the size of text are the HTML <big></big> and <small></small> tags, but these tags are not supported in HTML5.

More Java Script Code:
• Java Script Trigonometric Methods
• The for Loop
• JavaScript Operators
• Using the Java Script eval() Function
• Java Script alert Message Box
• The switch / case Structure
• The Document Object Model (DOM)
• Define Lines in a String
• Compare Two Strings
• Extract Part of a String

RSS Feed RSS Feed



Follow Stephen Bucaro Follow @Stephen Bucaro


Fire HD
[Site User Agreement] [Privacy Policy] [Site map] [Search This Site] [Contact Form]
Copyright©2001-2018 Bucaro TecHelp 13771 N Fountain Hills Blvd Suite 114-248 Fountain Hills, AZ 85268