The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
 Reply to this topicStart new topic
> How to increase font size on changing text, Changing font size on a written script.
a.singh18
post Feb 29 2016, 07:33 PM
Post #1





Group: Members
Posts: 4
Joined: 29-February 16
Member No.: 24,030
Hey just needed to know how i could change the font size in this html script. Script basically scrolls through 5 texts with a timer, replaces text with new one and repeats the process

<html>
<head>
<script>
var counter = 0;

function changeText()
{
var quotes = new Array();

quotes[0] = "Quick and reliable service - Simran";
quotes[1] = "They beat my other competitors by 15% - Paul";
quotes[2] = "Delivered with free installation and setup - Anna ";
quotes[3] = "Large selection of signs to choose from - James";
quotes[4] = "Eye catching designs! - Eric";

if (counter > 4)
{
counter = 0;
}

document.getElementById("textslide").innerHTML = quotes[counter];

setTimeout(function(){changeText()},9000);
counter ++;
}
</script>
</head>
<body onload="changeText();">

<p id="textslide">
</body>
</html>



this is not my code, borrowed from an open source. If someone could just edit my exisiting one so i can copy paste it into my application that would be much appreciated, thanks.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Feb 29 2016, 07:46 PM
Post #2


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6
Do it the normal why with CSS, by styling p#textslide. That the text is generated by JavaScript doesn't matter.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
a.singh18
post Mar 5 2016, 04:08 PM
Post #3





Group: Members
Posts: 4
Joined: 29-February 16
Member No.: 24,030
QUOTE(pandy @ Feb 29 2016, 05:46 PM) *

Do it the normal why with CSS, by styling p#textslide. That the text is generated by JavaScript doesn't matter.


the website builder im using only allows html
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Mar 5 2016, 04:37 PM
Post #4


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6
Then how can you use JavaScript? You can embed CSS the same way as you've embedded the script, if external files is the problem.
http://htmlhelp.com/reference/css/style-html.html#embedding
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
a.singh18
post Mar 5 2016, 05:36 PM
Post #5





Group: Members
Posts: 4
Joined: 29-February 16
Member No.: 24,030
QUOTE(pandy @ Mar 5 2016, 02:37 PM) *

Then how can you use JavaScript? You can embed CSS the same way as you've embedded the script, if external files is the problem.
http://htmlhelp.com/reference/css/style-html.html#embedding


Sorry i am a complete noob with html/css haha. So there is no way to make text size bigger with just the code i have above? I dont understand this link posted, what does the link do?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Mar 5 2016, 06:21 PM
Post #6


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6
It takes you to a page that tells you how to embed CSS. OK, if you are a newbie, here's what you do. Paste the below inside the HEAD tags. If it comes before or after the script block doesn't matter.

CODE
<style type="text/css">
#textslide  { font-size: 2em }
</style>


That will make the text rather large. I don't know how you want it. You can change the size as you like. You can use decimals too, like 1.2em or 0.8em. In your document 1em will be the same size as the body text. More than 1 will be larger and less will be smaller. You can use a lot of other units too, but see where this takes you to start with. Note that the unit must come directly after the value, no space between them. Not 1 em but 1em.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
a.singh18
post Mar 5 2016, 06:29 PM
Post #7





Group: Members
Posts: 4
Joined: 29-February 16
Member No.: 24,030
QUOTE(pandy @ Mar 5 2016, 04:21 PM) *

It takes you to a page that tells you how to embed CSS. OK, if you are a newbie, here's what you do. Paste the below inside the HEAD tags. If it comes before or after the script block doesn't matter.

CODE
<style type="text/css">
#textslide  { font-size: 2em }
</style>


That will make the text rather large. I don't know how you want it. You can change the size as you like. You can use decimals too, like 1.2em or 0.8em. In your document 1em will be the same size as the body text. More than 1 will be larger and less will be smaller. You can use a lot of other units too, but see where this takes you to start with. Note that the unit must come directly after the value, no space between them. Not 1 em but 1em.


Thanks so much, sadly im not that good in html or css haha. C# is the way to go smile.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
« Next Oldest · Client-side Scripting · Next Newest »
 

Reply to this topicStart new topic
2 User(s) are reading this topic (2 Guests and 0 Anonymous Users)
0 Members:

 

Display Mode: Standard · Switch to: Linear+ · Switch to: Outline

Track this topic · Email this topic · Print this topic · Subscribe to this forum

- Lo-Fi Version Time is now: 18th April 2024 - 08:26 PM
Invision Power Board © 2024  IPS, Inc.
Licensed to: HTMLHelp.com, LLC