Sonntag, 3. Februar 2008

Zooming in the old COM Webbrowser Control

You may use the traditional COM Webbrowser Control for cetain reasons. How is the zoom changed in this Control?

It is NOT like in the managed Version of the HTMLDocument.

Dim Zoomlevel As Integer = 100



Private Sub WebBrowser_PreviewKeyDown(ByVal sender As Object, ByVal e As System.Windows.Forms.PreviewKeyDownEventArgs) Handles WebBrowser.PreviewKeyDown
If e.Control = True AndAlso e.KeyCode = Keys.Subtract Then
Zoomlevel *= 0.95
Me.Browserinfoobj.HTMLDocument.body.style.setAttribute("zoom", Zoomlevel & "%")
ElseIf e.Control = True AndAlso e.KeyCode = Keys.Add Then
Zoomlevel /= 0.95
Me.Browserinfoobj.HTMLDocument.body.style.setAttribute("zoom", Zoomlevel & "%")
ElseIf e.Control = True AndAlso e.KeyCode = Keys.NumPad0 Then
Zoomlevel = 100
Me.Browserinfoobj.HTMLDocument.body.style.setAttribute("zoom", Zoomlevel & "%")
End If
End Sub


 



 



 

How to zoom inside an System.Windows.Forms.Webbrowser Control?

If I talk about zooming webseite I think of the way IE 7 zoomes them. So we are talking about a real zoom NOT about chaning the fontzises. This optical webseite zoom is unique to IE 7. The question is: How does it work?

The answer is quite simple. You have to manipulate the DOM of the Website. So everything is made by the use of a System.Windows.Forms.HTMLDocument.

In this example it is required to have 3 keydowns registered. One for "+", another for "-" and the 3rd for "0". All 3 should onlny fired if the control key is also pressed. Thing about that: Writing inside a webform and then the zoom of the site changes all the time. That would not be the effect you want to have. ;)

First we need a Variable where we save the zoom size.

Dim Zoomlevel As Integer = 100


   Private Sub Webbrowser_PreviewKeyDown(ByVal sender As Object, ByVal e As System.Windows.Forms.PreviewKeyDownEventArgs) Handles Webbrowser.PreviewKeyDown
If e.Control = True AndAlso e.KeyCode = Keys.Subtract Then
Zoomlevel *= 0.95
Me.Webbrowser.Document.Body.Style = "zoom: " + Zoomlevel.ToString + "%"
ElseIf e.Control = True AndAlso e.KeyCode = Keys.Add Then
Zoomlevel /= 0.95
Me.Webbrowser.Document.Body.Style = "zoom: " + Zoomlevel.ToString + "%"
ElseIf e.Control = True AndAlso e.KeyCode = Keys.NumPad0 Then
Zoomlevel = 100
Me.Webbrowser.Document.Body.Style = "zoom: " + Zoomlevel.ToString + "%"
End If
End Sub


So what is this Code doing?



First the keys are detected. That is nothing special to an KeyDown Event. The Sizing is a bit special in this Vesion since it does not just add a Value. We use a multiplication *.95 for reducing the dize and a division for making things bigger. The Combination of Control an NumPad0 just setzt the size to the normal value.



So why is there a muliplication or a division? It is just my idea. You can do it with a fixed value. But thing of this: By zooming out with every zoom the difference between the last size and the new size will be smaller. By zooming in the difference will be bigger with each zoom. As I think here the user gets faster the size he wants. And you do not use high steps for changing since the factor is just .95.