Skip navigation.

Ramblings

a test …

Zoom text only in web pages with Opera

Saturday, 12. May 2007, 15:17:08

, ,

Most of you are probably familiar with the zoom function of Opera. Opera lets you zoom the entire page, including pictures and flash animations, this is different from the zoom functionality other browsers have which is basically text zoom only. But how do you zoom text only in Opera?

You can of course go into Tools -> Preferences -> Advanced -> Fonts and set the Minimum font size to something appropriate so that text never gets smaller than a certain size. Mine is at 11 pixels now. But sometimes you want to zoom text on pages for small periods, or only on certain pages. The solution is a simple User Javascript.

Download the zoom-text.js script and put it any folder you prefer, I use ~/.opera/userjs/ on my Linux laptop. I have already also told Opera to run User Javascript that are located in that drawer, by going to Tools -> Preferences -> Advanced -> Content -> Javascript Options and putting ~/.opera/userjs/ in the User Javascript files field.



Now just go to any page, and you should see a little icon at the bottom right of the page. Click on this icon and you will get a box containing a "zoom in", "zoom out" and a "reset" button to play with. The script will automatically adjust the size the next time you visit the same domain to match the size you altered it to the previous visit.

Oooh green tagsPan or drag and scroll pages and images

Comments

Maulkin 9. May 2007, 06:48

Nice one!

Thank you very much!

Medium 13. May 2007, 17:32

Icon for zoom is very small, but it works! K-Meleon has zoom only for text or only for images, and I love it. Opera is lacking it.
Thank you, Nicolas! :smile:

nicomen 14. May 2007, 05:44

Change these for different icon size and control size

zoomIcon.style.fontSize = "12px";
zoomControls.style.fontSize = "12px";

You can try forcing another pixel value like "20px" or play with "1em", "1.5em" or "2.5em".

If you just change the zoomIcon one, you might need to add some more space for the controls using:

zoomControls.style.margin = "0.5em";

Glad you liked it.

Medium 16. May 2007, 23:33

Thank you for advice! Only at the beginning I could not notice the tiny icon, now it is okay without changes. :smile:
It is interesting: some sites automatically are unwinding the window editable for zoom without click.

nicomen 17. May 2007, 10:20

Hmm, I didn't understand that last sentence, could you rephrae it?

Medium 19. May 2007, 18:21

Go, please, to this page: http://alltheweb.com/ and see, how an icon of script is preserved. :smile:
And I'm sorry for my English... :/

Medium 21. May 2007, 07:32

Yes, exactly! Why? :smile:

nicomen 21. May 2007, 11:30

I don't see what's wrong with that screenshot, lol...

Ah ok, you are saying the xoom "window" pops up without you clicking it? It doesn't happen to me, hm, that's weird...

Medium 22. May 2007, 12:00

Absolutely nothing wrong, interesting only! :smile:

For the accuracy: it is necessary to use the search engine and only in results of searching one can see the automatically big icon from script.

And curiosity, try to add this search engine to your set...

nicomen 24. May 2007, 10:59

Ah I reproduced it now, very strange error. Oh well I worked around it now. redownload the script please. Thanks for reporting :wink:

Anonymous 5. June 2007, 10:59

Anonymous writes:

wargamez claims there is a bug in the anonymous posting, so I apologize for abusing the comments for testing... :-)

Anonymous 5. June 2007, 11:03

Anonymous writes:

http://www.dn.no/
Your script sticks to the flash stuff also, and on the very top flash it does not work.

nicomen 5. June 2007, 12:49

It sticks to all iframes at least

Do you mean the scroll text part? Because the flash ads on the top are not own paes it seems.

If it's the scroll text part, I'm not sure I know how I should go forth to make it work in so small areas...

Anonymous 5. June 2007, 13:40

Anonymous writes:

Yes, thats what I meant :)

Anonymous 25. April 2008, 18:13

penkapp writes:

Does this work for web pages that do not use .html? It does not seem to work on pages using .php or .shtml.

nicomen 28. April 2008, 01:00

Should work on .php and .shtml pages as it checks for document.body only

Anonymous 6. April 2009, 23:23

Cihan writes:

Thanks, It works perfectly.

Anonymous 16. June 2009, 13:12

Anonymous writes:

Bless you, sir. Now I can use Opera 9.5.

Anonymous 30. June 2009, 16:37

sarylce writes:

Thank you very much. Why doesn't opera have this feature built-in like firefox? It should be built-in in future release.

Anonymous 8. August 2009, 11:06

Anonymous writes:

Is it possible for this script to work cross sessions?

nicomen 8. August 2009, 13:56

What do you mean by cross-session?

ericnott 9. August 2009, 16:27

A session means that open Opera and then exit., and sorry it does not have anything to do with session store in Opera. I should have said it first that thank you very much for the script. It is so useful that I have highly recommended it to my friends; if they care to use opera.

I do not know if there is any relation between the script and cookies of sites. On one hand, it remembers the setting of sites within a "session", and hence I guess it might have something to do with cookies. On the other hand, I do not delete cookies, and hence it should remember the settings if the scripts is to do with cookies.

I have used the script not long after you posted it on opera forums. I do know what kept from asking the question. Since beta version of Firefox 3, I had wished that I don't have to set the text zoom very session.

nicomen 10. August 2009, 09:37

I thought it should remember between sessions, maybe it doesn't, I guess it then needs to set a proper date on the cookies it uses...

ericnott 11. August 2009, 04:23

Care to explain how it does in cookies? Thx!

nicomen 11. August 2009, 09:53

If you change the expire date variable inside the setCookie function to way ahead in the future it should remember things across sessions :wink:


var days = 1000;
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();

ericnott 12. August 2009, 01:36

I am sorry that the script stopped working after the change. Although the little graph with zoom level, plus button, minus button, and Reset button appear, there is no function when I press any of the buttons. I will try if it is the settings in my cookies first.:up:

ericnott 17. August 2009, 05:32

Hello there,

You had me tried hard understand more of cookies and javascripts. I think I have made it work. The script is as follows in the function setCookie:

function setCookie(cookieName, cookieValue) {
var days = 1000;
var date = new Date();
date.setTime(date.getTime()+(days*24*60*60*1000));
var expires = "; expires="+date.toGMTString();
var path = "/";
var domain = location.hostname;
var secure = null;
document.cookie = escape(cookieName) + '=' + escape(cookieValue)
+ (expires ? expires : '')
+ (path ? '; PATH=' + path : '')
+ (domain ? '; DOMAIN=' + domain : '')
+ (secure ? '; SECURE' : '');
}

Is there anything wrong here? It is working so far, but not for all websites; eg, http://www.google.com and http://www.economist.com, which do not change the value of zoom level (zoom:0 all the time) while clicked plus or minus signs. Although the text sizes in pages are changed, they return to default zoom settings after pages are refreshed, even in the same "session". I am quite happy though. Thanks a lot...:D

Correct my mistakes if you do not mind. Thanks...

nicomen 17. August 2009, 13:22

Do you get anything in the error console? It could be a variety of reasons of course, but I don't currently have that much time to look into it, I'm afraid...

ericnott 18. August 2009, 08:30

Mainly it's the two Javascript errors:

JavaScript - http://my.opera.com/nicomen/blog/2007/05/12/zoom-text-only-in-web-pages-with-opera?cid=9930321
User Javascript thread
Error:
name: ReferenceError
message: Statement on line 4: Undefined variable: WScript
stacktrace: n/a; see opera:config#UserPrefs|Exceptions Have Stacktrace

JavaScript
User JS compilation
Syntax error ...\UserJs\xerath-power-meenoo.js: line 532 of User JS script :
Expected token: ')'
})( window.opera
-----------------^


I did not even know opera grabs js from the net, and I don't have any clue what these two errors mean.

Take your time. It's not urgent.

nicomen 18. August 2009, 10:48

Seems like only one error? and it's from another script...

nazartokar 15. November 2009, 22:31

Hi Nicolas, thanks for the useful JS!
I've got two questions:

1. Can I make it remember settings even after Opera restarts? I've read that settings are been saved to the cookies. Cookies are enabled but zoom settings reset after every reload.

2. Can I change settings and zoom not only text but all over the page and save this setting for every site? Thanks!

How to use Quote function:

  1. Select some text
  2. Click on the Quote link

Write a comment

Comment
(BBcode and HTML is turned off for anonymous user comments.)

If you can't read the words, press the small reload icon.


Smilies

Download Opera, the fastest and most secure browser

Photos

Multimedia messageMultimedia messageMultimedia message
December 2009
M T W T F S S
November 2009January 2010
1 2 3 4 5 6
7 8 9 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31

Amiga

Development

Opera

  • Planet Opera

    A planet consisting of Opera employees and related people