Nicolas Mendoza

Zoom text only in web pages with Opera

2007年5月12日土曜日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

最新コメント

Maulkin # 2007年5月9日水曜日6:48:14

Nice one!

Thank you very much!

Medium # 2007年5月13日日曜日17:32:23

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!

Nicolas Mendozanicomen # 2007年5月14日月曜日5:44:25

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 # 2007年5月16日水曜日23:33:47

Thank you for advice! Only at the beginning I could not notice the tiny icon, now it is okay without changes.

It is interesting: some sites automatically are unwinding the window editable for zoom without click.

Nicolas Mendozanicomen # 2007年5月17日木曜日10:20:56

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

Medium # 2007年5月19日土曜日18:21:08

Go, please, to this page: http://alltheweb.com/ and see, how an icon of script is preserved.

And I'm sorry for my English... :/

Nicolas Mendozanicomen # 2007年5月21日月曜日5:19:32

http://my.opera.com/nicomen/albums/showpic.dml?album=47482&picture=3982691

Like this?

Medium # 2007年5月21日月曜日7:32:46

Yes, exactly! Why?

Nicolas Mendozanicomen # 2007年5月21日月曜日11:30:49

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 # 2007年5月22日火曜日12:00:25

Absolutely nothing wrong, interesting only!

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...

Nicolas Mendozanicomen # 2007年5月24日木曜日10:59:51

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

匿名 # 2007年6月5日火曜日10:59:26

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

匿名 # 2007年6月5日火曜日11:03:14

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

Nicolas Mendozanicomen # 2007年6月5日火曜日12:49:22

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...

匿名 # 2007年6月5日火曜日13:40:57

Anonymous writes: Yes, thats what I meant :)

匿名 # 2008年4月25日金曜日18:13:32

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.

Nicolas Mendozanicomen # 2008年4月28日月曜日1:00:57

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

匿名 # 2009年4月6日月曜日23:23:43

Cihan writes: Thanks, It works perfectly.

匿名 # 2009年6月16日火曜日13:12:28

Anonymous writes: Bless you, sir. Now I can use Opera 9.5.

匿名 # 2009年6月30日火曜日16:37:54

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.

匿名 # 2009年8月8日土曜日11:06:36

Anonymous writes: Is it possible for this script to work cross sessions?

Nicolas Mendozanicomen # 2009年8月8日土曜日13:56:19

What do you mean by cross-session?

ericnott # 2009年8月9日日曜日16:27:28

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.

Nicolas Mendozanicomen # 2009年8月10日月曜日9:37:22

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 # 2009年8月11日火曜日4:23:29

Care to explain how it does in cookies? Thx!

Nicolas Mendozanicomen # 2009年8月11日火曜日9:53:57

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


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

ericnott # 2009年8月12日水曜日1:36:28

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.

ericnott # 2009年8月17日月曜日5:32:45

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...

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

Nicolas Mendozanicomen # 2009年8月17日月曜日13:22:31

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 # 2009年8月18日火曜日8:30:46

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.

Nicolas Mendozanicomen # 2009年8月18日火曜日10:48:08

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

nazar tokarnazartokar # 2009年11月15日日曜日22:31:23

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!

metude # 2010年1月26日火曜日22:12:32

Can you add shorcut?

匿名 # 2010年2月23日火曜日23:11:27

heinzy writes: brilliant, thanks mate.

dapxin # 2010年7月7日水曜日8:30:56

Will you submit this to http://extendopera.org pls ?

匿名 # 2010年7月7日水曜日12:57:43

curious writes: Hello Nicolas. Great script there. Wanted to know if it's possible to edit the script in such a way, that I have a default text-zoom of 3? Thanks.

Kamaleshkamalesh # 2010年8月5日木曜日20:16:26

Thanks much, Nicolas...nice text-zoom extension for Opera.

Here's a modified User JS w/o the GUI and shortcuts, FYI.
http://indigo176.blinkenshell.org/zoom-text2/

metude # 2010年8月5日木曜日21:16:51

Nice...
I'll introduce on operaturkiye.net in next posts... (opera fan page fo Turkish Opera fans...)

Also you can post here

Edit: I'm using laptop, and + key isn't usefull. You used key code in js source code, is there a list all keyboard key codes?

匿名 # 2010年9月6日月曜日9:05:32

Peter writes: Hallo Nicolas, can you explain, why I can't set, with this script, the font size smaller than the Minimum font size of Opera, thanks for answer

匿名 # 2011年9月9日金曜日11:27:34

kryksyh writes: Thank you!

metude # 2011年9月9日金曜日12:13:24

Here a usefull extension that makes this:
Font resizer: https://addons.opera.com/addons/extensions/details/font-resizer/?display=en