Text resing

**maxxxx** · 10-08-2015, 04:07 PM

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 &copy; 2015 Charisma Communications		       
   Website Designed By CJ Web Consulting
</a>
</footer>

</div><!-- end #container -->

</body>
</html>

**Beverleyh** · 10-08-2015, 06:05 PM

A link to a reduced test page would be better.

**maxxxx** · 10-08-2015, 06:22 PM

You mean the actual html page? I think thats what you mean. here you go.

http://www.charismacommunications.ca/

**Beverleyh** · 10-08-2015, 09:07 PM

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

**maxxxx** · 10-08-2015, 10:48 PM

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