I am writing small webbrowser in C# and I would like it to wrap works and images, instead of using horizontal scroll bar.
I need something similar to Word Wrap, as in Notepad.
Here is an example:
Chrome:
My browser:
I've looked at other topics but many suggest solutions in CSS and dealing with html.
I was wondering if there is a way to disable that in WebBrowser itself or by using some other method.
To clarify, Scroll Bar is not a problem, I know that it can easily be disabled by:
webBrowser1.ScrollBarsEnabled = false;
In standard HTML mode, images wrap automatically. E.g.:
<!DOCTYPE html>
<head>
<title></title>
<meta http-equiv="X-UA-Compatible" content="IE=edge"/>
<script>
window.onload = function() {
for (var i = 0; i < 50; i++) {
var img = document.createElement("img");
img.src = "http://png-4.findicons.com/files/icons/1943/yazoo_smilies/128/big_smile.png";
container.appendChild(img);
}
}
</script>
</head>
<body>
<div id="container"></div>
</body>
Fiddle: http://jsfiddle.net/Noseratio/VzdDW/
You did not post your HTML, so it's hard to guess, but try enabling the standard mode, both for your web page and for WebBrowser control (by implementing browser feature control).
Related
Trying to work with WebBrowser control in a Winforms because I really want to use HTML5/CSS to style a GUI (happy to sink events in C#). But a hover style does not work.
So open a C# Winforms project and call it HoverNotWorking. Add a new HTML page called HTMLPage1.html and paste in following HTML
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title></title>
<style>
a#clickMe:hover {
background-color: #1A365B;
color: white;
}
a#clickMe {
background-color: #E0F1EA;
color: #000000;
}
</style>
</head>
<body>
<a id="clickMe">Click Me2</a>
</body>
</html>
Feel free to verify it works in an ordinary browser, does for me.
Go to the Form1 and add a WebBrowser control.
An attempted solution was to configure the browser emulation of WebBrowser (I had no idea this was possible, limited to versions of IE I'm afraid). So I placed this code in Main() so it looks like this (resolve the usings)
[STAThread]
static void Main()
{
// Make WebBrowser control emulate IE11
// https://msdn.microsoft.com/en-us/library/ee330730(v=vs.85).aspx#BROWSER_EMULATION
RegistryKey keyIeFeatureControl = Registry.LocalMachine.OpenSubKey(
#"Software\Microsoft\Internet Explorer\Main\FeatureControl");
RegistryKey keyIeFeatureBrowserEmulation = keyIeFeatureControl.OpenSubKey(
"FEATURE_BROWSER_EMULATION", true);
keyIeFeatureBrowserEmulation.SetValue(System.Reflection.Assembly.
GetExecutingAssembly().GetName().Name, 69632); // 69632 = &h11000
keyIeFeatureBrowserEmulation.Close();
keyIeFeatureControl.Close();
Application.EnableVisualStyles();
Application.SetCompatibleTextRenderingDefault(false);
Application.Run(new Form1());
}
And in the Form1.cs file we need a little code to locate the HTMLPage1.html in the solutions top folder. Otherwise the code is plain ordinary.
public partial class Form1 : Form
{
public Form1()
{
InitializeComponent();
Assembly myExe = System.Reflection.Assembly.GetExecutingAssembly();
string filePath = Path.GetDirectoryName(new Uri(myExe.CodeBase).LocalPath);
string myFile = System.IO.Path.Combine(filePath, #"..\..\HTMLPage1.html");
if (File.Exists(myFile))
{
this.webBrowser1.Navigate(myFile);
}
}
}
But the hover CSS refuses to work. Now I'm sure I could an event handler to capture mouseover etc. but that's not the point. This should work. I have configured the browser control to use IE11, very modern version. This should work.
What am I missing?
I've made what you depicted. Everything worked out after I substituted 69632 with 11000 and got the correct name of the program process this way:
var fileName = System.IO.Path.GetFileName(System.Diagnostics.Process.GetCurrentProcess().MainModule.FileName);
So that setting the parameter is:
keyIeFeatureBrowserEmulation.SetValue(fileName, 11000);
I'm using the old WebBrowser control in a winforms app (C#) to display some static html document. So far, I managed to display what I want, react in a custom way to link clicks, show custom rich tooltips etc.
I'm struggling to set custom mouse cursors, though. The Control itself does not support the ctrl.Cursor property, and setting cursors via CSS in the HTML does only work for standard cursors, NOT for custom cursors.
I'm aware of the neccessity to set the engine to latest (see meta tag in head). The question is, how can I point to a .cur / .png file; I tried with relative paths, absolute paths (just for tests), or doesn't the WebBrowser control maybe allow custom cursors at all?
Here's my snippet:
this.webBrowser1.DocumentText = #"<!DOCTYPE html>
<html>
<head>
<meta http-equiv=""X-UA-Compatible"" content=""IE=edge"" />
<title>Foo</title>
<style>
.customcursor {cursor:url('C:\path\to\stuff.cur'), auto !important;}
</style>
</head>
<body>
<a href='...' class='customcursor'>Foo</a>
</body>
</html>";
I am trying to open pdf in a new tab using Asp.net mvc controller.
it is opening in new tab correctly but the document name is not showing
here is my code
public ActionResult ViewDocument()
{
byte[] docFileArr=......
var cntdn = new System.Net.Mime.ContentDisposition
{
FileName = DocumentName,
Inline = true,
};
Response.AppendHeader("Content-Disposition", cntdn .ToString());
return File(docFileArr, "application/pdf");
}
the document opening in new window correctly but it showing the controller name only not the document name. please see the attachment.
thanks in advance for help
One way to achieve this is to set the title in the metadata of the PDF (either during creation of the PDF or manipulating it, before the download begins). This has been covered by the already given SO questions.
Another approach is to open a new tab, load an own HTML page generated by an ASP.NET MVC View there, which itsself embeds the PDF file, provided by the ViewDocument action (a more appropriate name would be DownloadDocument).
The HTML page would have a Title in its HTML header, that would be shown by the browser. E.g. the view can look like (just to give the idea):
#{
Layout = null;
}
<!DOCTYPE html>
<html height="100%">
<head>
<meta charset="utf-8" />
<title>#Model.Caption</title>
<script src="/js/pdfobject.js"></script>
<style>
.pdfobject-container {
height: 96vh;
width: 99vw;
}
</style>
</head>
<body height="100%">
<div id="pdf" height="100%"></div>
<script>PDFObject.embed("#Model.DownloadUrl", "#pdf");</script>
</body>
</html>
It uses the PDObject.js library to make PDF embedding easier and less error prone.
Web browser actually use metadata included in the PDF files in order to display the title. That way, your file will have the same title without any regards to how it's loaded (from your .NET app, from the desktop after download, etc.).
See this article on how to view and edit metadata from Adobe, using Acrobat: https://helpx.adobe.com/acrobat/using/pdf-properties-metadata.html
I have a Windows Forms application that uses a WebBrowser control to display an embedded web page. The file is (successfully) loaded using:
webHelp.DocumentStream=
Assembly.GetExecutingAssembly()
.GetManifestResourceStream("MyAssembly.help.html");
In order for this to work (i.e. the file to be loaded/displayed) I set the webHelp.AllowNavigation = false;. I don't fully understand why, but if it's set to true, the page is not displayed.
In my HTML document (see bellow) I want to be able to navigate trough different sections. But when I click on a link, the browser control does not go to the targeted element. The web page works fine in the stand-alone Internet Explorer 10, so it must have something to do with the control, more specifically the AllowNavigation property. MSDN didn't help much.
How can I achieve this navigation behavior? Is there another way of loading the HTML file without setting the AllowNavigation property to false?
This is my simple HTML file:
<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Using this tool</title>
</head>
<body>
<h3>Description</h3>
<div><p id="contents">Contents</p></div>
<div>
<p id="general">Using the file converter</p>
<p>*converter description*</p>
Go To Top!
</div>
<div class="divBlock" >
<p id="selectOption">Selecting a conversion action</p>
<p>*action selection*</p>
Go To Top!
</div>
</body>
</html>
EDIT: After additional tests I found the root of the problem. The problem appeared after setting a value for the URL property, running the application and afterwards clearing this value. The embedded page is not loaded any more, unless the AllowNavigation property is set to false. There are two solutions, described in my answer bellow.
I also have my own WebBrowser. I've tested it and it loads your HTML file perfectly.
I simply used:
webBrowser1.Navigate("C:\\myPath\\SofNavigate.html");
When I click on links it goes to "#contents" without problems.
I am not sure why you need to use webHelp.Docstream instead of simple Navigate.
By the way, when I turn off navivation, then I am not able to go anywhere from the page that I started on. So Navigation must be on in order to go anywhere from the "home page".
Try to debug that part, as it appears to be the bigger problem that you have.
Here is a good example on how to set up simple webBrowser. Try to use it as a base and see what you do differently that messes up your navigation.
[EDITED] Win8/IE10, your code works for me unmodified inside Form.Load event on a simple form which has just a single WebBrowser control with all default settings (and WebBrowser.AllowNavigation is true by default). Check the properties of your WebBrowser control in the Designer, you may have something wrong in there.
[/EDITED]
You're using HTML5, which handles anchor links via id attribute (i.e. <p id="contents"> ... <a href="#contents">. By default, WebBrowser control works in legacy IE7 mode with HTML5 disabled. You need to turn it on with FEATURE_BROWSER_EMULATION feature control, before WebBrowser object gets created. The best place to do this is a static constructor of your form:
static MainForm()
{
SetBrowserFeatureControl();
}
private static void SetBrowserFeatureControl()
{
// http://msdn.microsoft.com/en-us/library/ee330730(v=vs.85).aspx#browser_emulation
// FeatureControl settings are per-process
var fileName = System.IO.Path.GetFileName(Process.GetCurrentProcess().MainModule.FileName);
// make sure the control is not running inside Visual Studio Designer
if (String.Compare(fileName, "devenv.exe", true) == 0 || String.Compare(fileName, "XDesProc.exe", true) == 0)
return;
// web pages containing standards-based !DOCTYPE directives are displayed in Standards mode
using (var key = Registry.CurrentUser.CreateSubKey(
#"Software\Microsoft\Internet Explorer\Main\FeatureControl\FEATURE_BROWSER_EMULATION",
RegistryKeyPermissionCheck.ReadWriteSubTree))
{
key.SetValue(fileName, (UInt32)9000, RegistryValueKind.DWord);
}
}
Try it and your links should work as expected. This solution does NOT require admin rights, the affected key is under HKEY_CURRENT_USER.
[UPDATE] There may be a better solution, it works at least for IE10 here on my side. Add <meta http-equiv="X-UA-Compatible" content="IE=edge" /> as below and leave the registry intact. If you see document.compatMode: CSS1Compat, document.documentMode: 10, you should be good to go, but test with older IE versions too.
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<title></title>
<script type="text/javascript">
window.onload = function () {
info.firstChild.data =
"document.compatMode: " + document.compatMode +
", document.documentMode: " + document.documentMode;
}
</script>
</head>
<body>
<pre id="info"> </pre>
</body>
</html>
EDIT: After finding the cause of the problem (see the edit to the question) I can now propose three solutions:
1. WebBrowser control replacement:
Simply delete the existing WebBrowser control and add a new one. This solution does not require any modification of the AllowNavigation property. DO NOT modify the URL property.
2. When deleting and adding a new WebBrowser control is not an option:
Since the AllowNavigation property was influencing the loading and displaying of the web page, there was no reason for it to be left to false afterwards. Setting back the property in the Shown event solved the navigation problem, without requiring other alterations (e.g. in the HTML file or the Registry):
private void helpForm_Shown(object sender, EventArgs e)
{
webHelp.AllowNavigation = true;
}
3. Reseting the Document
It seams that the Document property gets (automatically) initialized if URL property is at one time set and reset. Adding webHelp.Document.OpenNew(true); before loading the resource stream solves the problem without the need for re-adding the WebBrowser and without modifying the AllowNavigation property.
I have a small asp.net mvc app running on WIN2k3 and IIS6.
I'm using a wildcard mapping under the application settings in IIS as described in this article http://haacked.com/archive/2008/11/26/asp.net-mvc-on-iis-6-walkthrough.aspx . The application works fine under my local asp.net development server. When I publish from VS2008 out to the production server above the styles are looking partially rendered. For instance. I have an overflow: hidden; set on the body {} and the browser is showing a scrollbar horizontally and vertically. Also, the z-index on all my layers are incorrect. Any ideas would be much appreciated.
Here's a sample of my document head.
<head>
<meta http-equiv="Content-Language" content="en-us" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>page title | <%= ViewData["PageTitle"]%></title>
<link rel="shortcut icon" href="/content/images/misc/favicon.ico" type="image/x-icon" />
<%= Html.MooFrameworkConfig("Default")%>
<%= Html.JavaScript("/scripts/framework.js")%>
</head>
framework.js includes the CSS like so:
this.loadCSS("layout.css", "screen");
here is the loadCSS method:
framework.loadCSS = function(fileName,mediaType) {
var headID = document.getElementsByTagName("head")[0];
var cssNode = document.createElement('link');
cssNode.type = 'text/css';
cssNode.rel = 'stylesheet';
cssNode.href = '/content/skins/' + skinBase + '/css/' + fileName;
cssNode.media = mediaType;
headID.appendChild(cssNode);
}
Just as a test, does linking to the CSS file in the HTML (as opposed to loading it with JS) fix the problem?
It is unlikely to be a problem with the web server, per say. Is it possible that the stylesheet you're using isn't being served by the webserver? Maybe the URL to it is slightly different? Check by navigating manually to the stylesheet or by checking that it is being loaded in firebug.
Did you include the CSS fix from the article?
HttpContext.Current.RewritePath(Request.ApplicationPath, false);
I think you may need to post snippets from your website where you include the CSS file and where you simulate the article so that you can get better tips.
You can use Fiddler tool to check if all the files are loaded correctly, I mean no HTTP 403 or 500 or some other status codes for all the files (.css,.js) included in your page.
There maybe some server settings preventing displaying your page correctly.