|
JavaScript - Help-how To Change Font In Javascript
I have a javascript that randomly displays a different quote on my website. I have the quote programmed in, and they show up, but the text is tiny. I need help making the text bigger. I am a beginner at this, so i would appreciate help. This is the code:
Code: <script language='JavaScript'>
function random_content(){
var mycontent=new Array()
mycontent[1]='Repent! The end is coming! Were out of chips!'
mycontent[2]='I WANT, TO EAT, A DINOSAUR.'
mycontent[3]='Last night I lay in bed looking up at the stars in the sky and I thought to myself, where the heck is the ceiling.'
mycontent[4]='IT\'S A TRAP!'
mycontent[5]='tardo power,activate!'
mycontent[6]='LMS if ur gay'
mycontent[7]='1,2,...5!'
mycontent[8]='Box O Digletts'
mycontent[9]='Justice is best served cold, with a side of ranch dressing'
mycontent[10]='umm...I got nothing...awkward'
mycontent[11]='Once you visit you can never leave'
mycontent[12]='50% CaCow'
mycontent[13]='almost racist free!'
mycontent[14]='The last thing I want to do is hurt you. But it\'s still on the list'
mycontent[15]='BOOM! Left turn!'
mycontent[16]='Redrum'
mycontent[17]='If 4 out of 5 people SUFFER from diarrhea... does that mean that one enjoys it?'
mycontent[18]='Never, under any circumstances, take a sleeping pill and a laxative on the same night'
mycontent[19]='the beginning of the end'
mycontent[20]='Flaming fireballs Batman!'
mycontent[21]='gotta catch em\' all'
mycontent[22]='for the african children!'
mycontent[23]='One sexy thang'
mycontent[24]='It\'s Tardolicious!'
mycontent[25]='That\'s no moon!'
mycontent[26]='Caboose is god?'
mycontent[27]='MLIT'
var ry=Math.floor(Math.random()*mycontent.length)
if (ry==0)
ry=1
document.write(mycontent[ry])
}
random_content()
//-->
</script>
Similar TutorialsHi sorry if this is a very simple question but how do I change the font color for certain elements of this javascript code that the client sees on their brower? This is a count down script and I have made the code red that I am trying to change - any idea how to do this? Thanks v much!!!! <script type="text/javascript"> var today=new Date() //Enter the occasion's MONTH (1-12) and DAY (1-31): var theoccasion=new Date(today.getFullYear(), 03, 21) //Customize text to show before and on occasion. Follow grammer below: var beforeOccasionText="until this event" var onOccasiontext="Event is Today!" var monthtext=new Array("Jan","Feb","Mar","April","May","June","July","Aug","Sep","Oct","Nov","Dec") theoccasion.setMonth(theoccasion.getMonth()-1) //change to 0-11 month format var showdate="("+monthtext[theoccasion.getMonth()]+" "+theoccasion.getDate()+")" //show date of occasion var one_day=1000*60*60*24 var calculatediff="" calculatediff=Math.ceil((theoccasion.getTime()-today.getTime())/(one_day)) if (calculatediff<0){ //if bday already passed var nextyeartoday=new Date() nextyeartoday.setFullYear(today.getFullYear()+1) calculatediff=Math.ceil((nextyeartoday.getTime()-today.getTime())/(one_day)+calculatediff) } //Display message accordingly var pluraldayornot=(calculatediff==1)? "day" : "days" if (calculatediff>0) document.write("<b>"+calculatediff+" "+pluraldayornot+" "+beforeOccasionText+" "+showdate+"</b>") else if (calculatediff==0) document.write("<b>"+onOccasiontext+" "+showdate+"!</b>") </script> Hello, Is there a way to change the font of the text within a document.writeln statement? Here is my code: Code: <pre><script type="text/javascript">
var num1= prompt ("Enter a number between 1 and 5");
try {
if(x>5) {
throw "Err1";
}
else if(x<1) {
throw "Err2";
}
}
catch(err) {
if(err=="Err1") {
document.writeln("Error! The value is too high.");
document.writeln("Please enter a new value.");
}
if(err=="Err2"){
document.writeln("Error! The value is too low.");
document.writeln("Please enter a new value.");
}
}</script></pre>
Thanks. I want the font color in the div to change color onclick and change back when clicked again. Tjis works only in IE but other browsers like FF and safari it changes color on click but does not change color back. I need it to work across. Please advise! <div onclick="if(this.style.color=='#666666') this.style.color='#005dab'; else this.style.color='#666666';" class="question">Your question goes here..</div> I am trying to figure out how to change certain text's font color, in the text area. I have been looking everywhere, but I haven't found a solution. Any help would be great, thanks, mazzzzz I want to deviate from using css to designate a font size in one place. I have a string with a name. This is stored in a variable called "name." I just re-defined name to include district number. Now, it is name=lastname+', '+district; I am appending this string into the html dom. I want the district portion to appear in a slightly smaller font. How can I do this without having to set up a separate <span>? Or can this be done? Hi, I have 3 sum fields which I want to change to a red colour if the value is > or < 100. Apparently this is a DAP, but I am using javascript to tweek some of the settings in DAP. function subtotal() if(document.getElementById("Sum1").value>100&&<100) { this.style.cssText='Z-INDEX: 2; LEFT: 6.667in; WIDTH: 0.729in; COLOR: red' { else this.style.cssText='Z-INDEX: 2; LEFT: 6.667in; WIDTH: 0.729in; COLOR: #339966' </SCRIPT> <SPAN class=MSTheme-Label id="Sum1_Label" style="Z-INDEX: 1; LEFT: 0.25in; OVERFLOW: hidden; WIDTH: 0.711in; POSITION: absolute; TOP: 0.125in; HEIGHT: 0.161in">Totals:</SPAN><SPAN class=MsoBoundSpan id="Sum1" onmouseover="subtotal()" dataFormatAs=TEXT style="Z-INDEX: 2; LEFT: 5.416in; WIDTH: 0.729in; COLOR: #339966; POSITION: absolute; TOP: 0.125in; HEIGHT: 0.187in" MsoTextAlign="General">Sum of Product 1</SPAN><SPAN class=MsoBoundSpan id="Sum2" onmouseover="subtotal()" dataFormatAs=TEXT style="Z-INDEX: 2; LEFT: 6.667in; WIDTH: 0.729in; COLOR: #339966; POSITION: absolute; TOP: 0.125in; HEIGHT: 0.187in" MsoTextAlign="General">Sum of Product 2</SPAN><SPAN class=MsoBoundSpan id="Sum3" dataFormatAs=TEXT style="Z-INDEX: 2; LEFT: 7.917in; WIDTH: 0.729in; COLOR: #339966; POSITION: absolute; TOP: 0.125in; HEIGHT: 0.187in" MsoTextAlign="General">Sum of Product 3</SPAN></DIV> I'm a noobie at coding, and I was wondeirng if anyone can help me with the coding. Many Thanks Hello all, Can anyone help me with a script for changing font color of a number within a table when there is a match? Table A contains numbers and table B contains numbers. When table B numbers matches some of the numbers in table A, the numbers in table A need to change color. I hope you understand what I mean. Dear All, I need to get JavaScript to change the font size used for a website if Opera is detected. I have been trying this but it hasn't worked: Code: function changeFooter(){
if (navigator.userAgent.indexOf("Opera") >= 0) { // if I alert this line the output is 0
document.getElementById("footer").style.fontSize = '0.5em';
};
};
in the head of the html document (as well as the link to the external JavaScript file): Code: <script type="text/javascript"> changeFooter(); </script> I tried using window.onload = changeFooter(); but still no luck. I used the same principle in a different function to change another css property via getElementById and it works beautifully so I am a bit puzzled. I then realised that I actually need to change the value of the font size in the body tag from 100% to 90% when Opera is detected so I changed the script to this: Code: function changeFooter(){
if (navigator.appName == 'Opera') {
document.write('<link href="styleOpera.css" rel="stylesheet" type="text/css" />');
}
else {
document.write('<link href="style.css" rel="stylesheet" type="text/css" />');
};
};
But it's still not working. I was hoping that I could benefit from your collective wisdom as I am not sure where I am going wrong with this and several hours spent searching the web for answers have been fruitless so far... My knowledge of JavaScript is not very extensive, I haven't studied it in great depth so perhaps I am making some very silly mistakes here. My pseudo code for this exercise is something like this: Code: detect browser
if browser = Opera {
change font-size for body to 90%
}
else {
do nothing
}
alternatively:
detect browser
if browser = Opera {
link to stylesheet1
}
else {
link to stylesheet2
}
Thanks in advance for your help, much appreciated. Kind regards, Cristina Alciati I'm using javascript to change the color of certain words in an html document. Right now it uses <font> to make the change. I would like to use a CSS class named "alert" from an external style sheet to make the change. I've tried multiple things but no luck (className="alert", setClassName="alert" ) What is the correct way to replace the font part with a CSS class? Here is the working script: Code: <script type = "text/javascript">
window.onload = function (){
var text = document.getElementsByTagName('body')[0].innerHTML;
text = text.replace(/disabled/gi, "<font color=red>Disabled</font>" );
text = text.replace(/\blocked/gi, "<font color=red>Locked</font>" );
document.getElementsByTagName('body')[0].innerHTML = text;
}
</script>
Hi there, I am having a problem with IE rendering the font of my website poorly, but only when the javascript code is allowed... The website is he www.thelivingsacred.co.uk And as you can see, there is a huge difference between IE8's rendering of the site once the scripts are allowed, and before, as well as a difference between IE8 and Firefox. Please could someone explain what's going on? Hello. I am trying to create a javascript function which when declaring a new object, would give it properties. I'll try and show what I am doing with some code, then explain it. Code:
<script type="text/javascript">
var Draggable = {
Create: function(e, options) {
newStyle(e, options);
}
};
function newStyle(destination, options) {
for (x in options) {
document.getElementById(destination).style.x = options[x];
}
}
new Draggable.Create('text', options = {border: "1px solid red"});
</script>
<div id="text">Text</div>
With this code, I am trying to create a new instance. I am then trying to change the border of the div with the id of "text". I know doing .style.x is what is breaking, but I'm not sure how to make it so the x will, work or to return that back to the Create function and work with it there? Any help would be appreciated. Thanks. Hi can you change this javascript for me please -------------------------------------------------------------------------- -------------------------------------------------------------------------- Code: <script type = "text/javascript">
function LogIn(){
loggedin=false;
username="";
password="";
username=prompt("Username:","");
username=username.toLowerCase();
password=prompt("Password:","");
password=password.toLowerCase();
if (username=="guest" && password=="login") {
loggedin=true;
window.location="home-page.html";
}
if (username=="guest2" && password=="login2") {
loggedin=true;
window.location="home-page2.html";
}
if (loggedin==false) {
alert("Invalid login!");
}
}
</SCRIPT>
---------------------------------------------------------------------------------------------------------------------------------------------------- Can someone change this script to instead of prompts i would like two text boxes and a button to login p.s There is also a different bit but thats for the button if you need this part then please ask Hi, When is a java script change in Production server,do we need to force the web users to clear their cache... Or is there any better way of doing it apart from using no cache header in HTML Can anyone point out why this might not be working??? In my style sheet I have the span #downarrow display:none; Code: <script type="text/javascript">
function arrow(boxName){
document.getElementById(boxName).style.display = 'block';
}
arrow('downarrow');
</script>
<span id="downarrow"><img src="http://www.mysite.com/images/downarrow.png" /></span>
Thanks!! Hi, On my website I use CSS Fixed Positioning, but unfortunately on many mobile devices in particular this doesn't work I'd like to be able to turn these into static (e.g. Go to bottom of page) on some devices, but I'm a bit stuck (The Div btw is called apDiv2) So far I've got Code: if(navigator.platform == 'iPad' || navigator.platform == 'iPhone' || navigator.platform == 'iPod' || navigator.platform == 'BlackBerry')
{
$("#apDiv2").css("position", "static");
};
but no dice. Does anybody know what I'm doing wrong? The full css file is at http://atomicbuilds.com/general.css Thanks, Ed P.S. Eventually I'd also like to change the actual positioning so -142px goes to 0px, so if anybody knows that that'd be great, but I'm more worried about this first Hey guys, so i have a comment section. And what i want to do is if the height of the comment box is larger then lets say 100px. I want to set the height of the comment box to 50px and then display a "read more" button. And this read more button would toggle and allow the height to be "auto" and not set to 50px. so my html would look like this Code: <div class="comment-section"> <div class="comment"><p>This is where text would go. </p></div> <div class="read-more">Read More</div> </div> I have the class "read-more" set to "display:none" How would i do this? This is what i have / was trying and have been unsuccessful Code: <script type="text/javascript">
$(function(if ($".comment".style.height > 100px;){
{
$".comment".style.height = 50px;
$".read-more".style.display = block;
}
});
</script>
Here's the code that I'm working with: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type ="text/javascript">
function HouseSel(){
document.getElementById("HouseSelect").value = '3'
alert (document.getElementById("HouseSelect").value);
}
</script>
</head>
<body>
<form action="https://www.paypal.com/us/cgi-bin/webscr" method="post" name="_xclick">
<select name="item_name" id="HouseSelect">
<option value="0" selected="selected">--Please Select a House--</option>
<option value="1">Nags Head</option>
<option value="Rent Deposite: Calib ">Calibre</option>
</select>
<input name="calculate3" type="button" id="calculate3" tabindex="2"
onclick="HouseSel(); " value="Calculate"/>
</form>
</body>
</html>
But it's still returning the initial value. How do I get it to 3? I need a JavaScript image changer like this: When you mouse over photo1.jpg, it will change to photo2.jpg. When you mouse over photo2.jpg it will change to photo 3.jpg and so on untill photo5.jpg. Please keep this in JavaScript form :) |
|||||||