User Name Password Register
DaniWeb IT Discussion Community
All
What is DaniWeb IT Discussion Community?
You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 375,173 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,145 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting
Views: 1597 | Replies: 2
Reply
Join Date: Jan 2006
Location: Land of Hope & Glory
Posts: 88
Reputation: j4mes_bond25 is an unknown quantity at this point 
Rep Power: 3
Solved Threads: 0
j4mes_bond25's Avatar
j4mes_bond25 j4mes_bond25 is offline Offline
Junior Poster in Training

Question Changing text-size ???

  #1  
Jun 11th, 2006
I happened to stumbled upon this website http://www.tristarwebdesign.co.uk/ whereby on the (near) top-left corner, the option of user being able to select text caught my attention. This could help the viewers of my website to select the tex-size they feel comfortable with.

Similar JavaScript can be found in http://www.dynamicdrive.com/dynamicindex9/textsizer.htm but this ONLY has two links of "Larger Font" and "Smaller Font", which users CONTINUOUSLY have to press to see the desired font size.

However, from the above website, you can see that the user can select the font-size STRAIGHT-AWAY by simply "choosing" (rather than continuously clicking) the font-size they desire.

You can see from this site: http://members.lycos.co.uk/darsh25/P...e/services.php that although, I've achieved the desired look but not the function as yet (top-left corner). Text file of "services.php" i.e. the coding can be seen from http://members.lycos.co.uk/darsh25/P...rvices.php.txt

Can anyone hence help me achieve the result EXACTLY as it occurs in http://www.tristarwebdesign.co.uk/ ??? I only wish to have this changes appearing ONLY in my "centerContent" container (hence NOT in the "footer" area). I could do with either using CSS (if such a thing is possible without creating a whole new stylesheet & increasing the size of ALL elements) or JavaScript (which would only need one single file, rather than many different stylesheets.)

My other related documents (like stylesheet & "inc" file, etc.) can be seen on:
http://members.lycos.co.uk/darsh25/Personal%20Website
Nope, I'm NOT God, but I'm British (which is the next best thing ;)
AddThis Social Bookmark Button
Reply With Quote  
Join Date: May 2005
Location: Wellington, New Zealand
Posts: 182
Reputation: alpha_foobar is an unknown quantity at this point 
Rep Power: 4
Solved Threads: 3
alpha_foobar's Avatar
alpha_foobar alpha_foobar is offline Offline
Junior Poster

Re: Changing text-size ???

  #2  
Jun 19th, 2006
Its funny you ask your question this way, because using 3 css files is exactly how the website you want to copy does it..

They use the javascript method you can see when you mouseover the link to disable the unwanted styles...

function setStylesheet(title) {
   var i, cacheobj;
   for(i=0; (cacheobj=document.getElementsByTagName("link")[i]); i++) 
   {
      if(cacheobj.getAttribute("rel").indexOf("style") != -1 && cacheobj.getAttribute("title")) {
         cacheobj.disabled = true;
         if(cacheobj.getAttribute("title") == title)
            cacheobj.disabled = false; //enable chosen style sheet
      }
   }
}

function chooseStyle(styletitle, days){
   if (document.getElementById){
      setStylesheet(styletitle);
      setCookie("mysheet", styletitle, days);
   }
}


<link rel="stylesheet" type="text/css" href="css/style.css" />

<link rel="alternate stylesheet" type="text/css" media="screen" title="style1" href="css/style2.css" />
<link rel="alternate stylesheet" type="text/css" media="screen" title="style2" href="css/style3.css" />
Reply With Quote  
Join Date: Jun 2006
Location: Berlin, Germany
Posts: 1
Reputation: Gizmologic is an unknown quantity at this point 
Rep Power: 0
Solved Threads: 0
Gizmologic Gizmologic is offline Offline
Newbie Poster

Re: Changing text-size ???

  #3  
Jun 19th, 2006
well as you just want to make some of your content sizeable there is an easy solution.
put a div tag arround that content and give it for example an ID
<div id="sizeable">center content</div>
Now put this javascript function into your head tag
<script language="JavaScript" type="text/javascript">
<!--             
function changeFontSize(thesize){
     var fontSizer = document.getElementById("sizeable");
           fontSizer.style["fontSize"] = thesize + "px";
}
//-->
</script>
now you have to call that function by using on those 3 Elements the onMouseDown="changeFontSize(30)" event handler.
find the font size you want by changing the value .. 30 is very big but good to check if it works.. gl
Reply With Quote  
Reply

Only community members can participate in forum threads. You must register or log in to contribute.

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

 

DaniWeb JavaScript / DHTML / AJAX Marketplace
Thread Tools Display Modes

Similar Threads
Other Threads in the JavaScript / DHTML / AJAX Forum

All times are GMT -4. The time now is 12:05 am.
Forum system based on vBulletin Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
©2003 - 2008 DaniWeb® LLC