Log in

View Full Version : 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/dynamicindex9/fluidtextresizer.html


<!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 (www.dynamicdrive.com)
* Visit http://www.dynamicDrive.com 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
mlegg
10-09-2015, 01:28 AM
http://www.dynamicdrive.com/dynamicindex9/fluidtextresizer.htm

5722
maxxxx
10-09-2015, 01:28 AM
It's all working now. Thank you Beverleyh :)