• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 582
  • Last Modified:

Changing the font size

I'd like to be able to let the user increase or decrease the font size of a site as they navigate through the site.  I need to implement this on both classic asp and .net.

Here's  a link to what I'd like to do - http://www.pfizerforliving.com.

If you look over to the right side of the page, the text reads:

Text Size:        A        A        A        A

Each time you click on the A, the font size will either increase or decrease.  Can someone send me some information as to how I can implement this on my site.  I use a stylesheet to change the text on my pages.

Thanks!
0
techiebabe
Asked:
techiebabe
  • 4
  • 2
  • 2
  • +1
2 Solutions
 
mcv22Commented:
0
 
stu_pbCommented:
You could store the current Font size in a Session variable:

Session("FontSize") = '5'

When you are creating the page you can dynamically link to the appropriate style sheet. (You need one style sheet for each size font you want to use.)

<%
If Session("FontSize") = 5 Then
     Response.Write "<link rel='stylesheet' type='text/css' href='Font5.css' />"
Else
     Response.Write "<link rel='stylesheet' type='text/css' href='Font6.css' />"
End If
%>

Good Luck!
0
 
techiebabeAuthor Commented:
stu_pb

I wasn't sure if I had create two style sheets.  I was hoping to avoid that, but again, I wasn't sure.  Thanks.  
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
stu_pbCommented:
You could also try with javascript.  This way you will not need to include font sized in your CSS and you can have only one.  It may be really slow though, I have never tried anything like this.

function ChangeFont(size)
{
     for (var i = 0;i < document.all.length;i++)
     {
          document.all[i].style.fontSize = size;
     }
}

You might have to filter out certain types of elements if they don't implement the fontSize property, but most of them should I think.

Good Luck!
0
 
InteractiveMindCommented:
You could use something like this then (so that you need not use 2 stylesheets):

<%
If Session("FontSize") = 5 Then
     Response.Write "<style type='css/text'>body{ font-size:5px; }"
Else
     Response.Write "<style type='css/text'>body{ font-size:6px; }"
End If
%>

Any CSS code within the HTML document will 'override' the CSS Stylesheet. :)

Regards;
0
 
InteractiveMindCommented:
Oops, add an end of script tag: </script>  to each response.
0
 
InteractiveMindCommented:
dammit. lol. sorry, that should be end of style tag (</style>), so use this:

<%
If Session("FontSize") = 5 Then
     Response.Write "<style type='css/text'>body{ font-size:5px; }</style>"
Else
     Response.Write "<style type='css/text'>body{ font-size:6px; }</style>""
End If
%>

lol - sorry
0
 
techiebabeAuthor Commented:
InteractiveMind - thanks I think that would definitely work, however, there are differnet font-sizes on the page, it may not work for all.

 stu_pb - i think you're right about the js.  

Give me a few days to test it out and I will accept the answer I go w/ in a few days.  Thanks for your efforts!!!
0
 
InteractiveMindCommented:
Sure thing :)
If you're using classes/id's in your code, then you could just change each class/id's font size, like so:

<%
If Session("FontSize") = 5 Then
     Response.Write "<style type='css/text'>.className{ font-size:5px; } #idName{ font-size:5px; }</style>"
Else
     Response.Write "<style type='css/text'>.className{ font-size:6px; } #idName{ font-size:6px; }</style>""
End If
%>

But, it's entirely up to you :) Good luck with it.
0

Featured Post

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 4
  • 2
  • 2
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now