-
Text resing
I found this article on text resizer and used it on my site. But for some reason. I can't get it to work. Any thoughts anyone?
http://www.dynamicdrive.com/dynamici...xtresizer.html
HTML Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="description" content="Charisma Communications">
<title>Charisma Communications - Cover</title>
<link rel="stylesheet" media="screen" href="css/main.css">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="Charisma Communications">
<meta name="keywords" content="Motovational,Charisma,Toes,Louis Gaudry,Public Speaker">
<meta name="author" content="Louis Gaudry">
<style type="text/css">
body {
margin-left: 0px;
}
</style>
<!-- start resize text style -->
<style type="text/css">
.controlstyle a{ /*links inside DIV sizecontroldiv*/
outline:none;
}
.controlstyle a img{ /*image links inside DIV sizecontroldiv*/
border-width:0;
}
.controlstyle a.selectedcontrol img{ /*selected control's image*/
border-bottom:4px solid darkred;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript" src="fluidtextresizer.js">
/***********************************************
* Fluid Text Resizer- (c) Dynamic Drive DHTML code library ([url]www.dynamicdrive.com[/url])
* Visit [url]http://www.dynamicDrive.com[/url] for hundreds of DHTML scripts
* Please keep this notice intact
***********************************************/
</script>
<script type="text/javascript">
var mytextsizer=new fluidtextresizer({
controlsdiv: "sizecontroldiv", //id of special div containing your resize controls. Enter "" if not defined
targets: ["body"], //target elements to resize text within: ["selector1", "selector2", etc]
levels: 3, //number of levels users can magnify (or shrink) text
persist: "session", //enter "session" or "none"
animate: 200 //animation duration of text resize. Enter 0 to disable
})
</script>
<!-- end resize text style -->
</head>
<body>
<div id="container">
<header>
<!-- start resize text -->
<div align="right" id="sizecontroldiv" class="controlstyle>
Increase/Decrease controls: <a href="#smaller"><a href="#bigger"><img src="images/fontminus.gif" /></a> *<a href="#bigger"><img src="images/fontplus.gif" /></a><br /><br />
</div>
<!-- end resize text -->
<img id="fullbody" src="images/fullbody.png" alt="Full Length image of Louis Gaudry">
<h1 class="header">Charisma Communications</h1>
<h3 class="header">"...Moving People Beyond Their Limitations..."</h3>
</header>
<div id="preamble">
<h2><a id="ms" href="about.html">Motivational Speaker</a></h2>
<hr>
<h2><a href="aboutus.html" id="ms"">Accessible Website Design
and Development </a> </h2>
</ul></div>
<!-- end #preamble -->
<footer>
<a href="http://www.cjwebconsulting.com/" target="_blank">
Copyright © 2015 Charisma Communications
Website Designed By CJ Web Consulting
</a>
</footer>
</div><!-- end #container -->
</body>
</html>
-
A link to a reduced test page would be better.
-
You mean the actual html page? I think thats what you mean. here you go. :)
http://www.charismacommunications.ca/
-
The 'fluidtextresizer.js' file isn't where your markup says it is so its throwing a 404 error.
According to your markup, it should be located here http://www.charismacommunications.ca/fluidtextresizer.js
-
In the code at the beginning of my post. I have all code in one page. I did not realize there was fluidtextresizer.js file. Where would I find it? Here? http://www.dynamicdrive.com/dynamici...xtresizer.html
-
1 Attachment(s)
-
It's all working now. Thank you Beverleyh :)
