I want to apply different css on different browsers.
I want to run one css when it is safari and second for all others.
How can I detect that and apply css according to that?
You can use CSS browser selectors for this. There are different solutions available for this on the net.
For example:
CSS Browser Selector
The CSS Browser Selector is a small JavaScript library which allows you to include different cascading style sheets (CSS) for each browser.
An example:
<style type="text/css">
.ie .example {
background-color: yellow
}
.ie7 .example {
background-color: orange
}
.opera .example {
background-color: green
}
.webkit .example {
background-color: black
</style>
If you Google for "different css per browser" you'll find other solutions as well, but most of them boil down to similar solutions.
Another way would be to detect the browser type and capabilities in ASP.NET so that you can render the appropriate HTML / CSS / ...etc. You can find more information on that topic here:
http://msdn.microsoft.com/en-us/library/3yekbd5b.aspx
For example:
private void Button1_Click(object sender, System.EventArgs e)
{
System.Web.HttpBrowserCapabilities browser = Request.Browser;
string s = "Browser Capabilities\n"
+ "Type = " + browser.Type + "\n"
+ "Name = " + browser.Browser + "\n"
+ "Version = " + browser.Version + "\n"
+ "Major Version = " + browser.MajorVersion + "\n"
+ "Minor Version = " + browser.MinorVersion + "\n"
+ "Platform = " + browser.Platform;
TextBox1.Text = s;
}
The Browser property of the Request returns a HttpBrowserCapabilities object. It contains information on the capabilities of the browser that is running on the client.
http://msdn.microsoft.com/en-us/library/system.web.httpbrowsercapabilities.aspx
You can examine the UserAgent property of the Request object.
Inside the page head tag
<%# Request.UserAgent.ToLower().Contains("safari") ?
"<link rel='stylesheet' type='text/css' href='safari.css' />" :
"<link rel='stylesheet' type='text/css' href='other.css' />" %>
Use below things....in your control...and you can set different style...to asp.net textbox control for different browser.
<asp:TextBox ID="TestTextBox" runat="server" ie:Text="You are in Internet explorer." mozilla:Text="You are in Firefox." Text="You are in other browser." ie:CssClass="IEStyle" mozilla:CssClass="FFStyle" CssClass="DefaultStyle" />
using Using the Request.Browser you can determine the browser user is using your
You can check it from javascript like:
if (navigator.appName == 'Microsoft Internet Explorer') {
var fileref = document.createElement("link")
fileref.setAttribute("rel", "stylesheet")
fileref.setAttribute("type", "text/css")
fileref.setAttribute("href", filename)
}
Related
Hey all I am using the new WebView2 with my WinForms app. I can get it to display my dynamic html that I create but it has the "" when it tries to load the images for the page.
The image tag looks like this:
<div id="animation1" style="display: inline-flex;">
<img src="file:///C:\Users\admin\source\repos\wCondictions\bin\x86\Debug\Resources/nice.gif" style="height: 110px; width: 110px;">
<span class="imgWeather">Nice</span>
</div>
The code I am currently using is this:
fileNames = new DirectoryInfo(resourcePath)
.GetFiles()
.OrderBy(p => Path.GetFileNameWithoutExtension(p.Name))
.Select(fi => fi.Name)
.ToArray();
string blah = Path.Combine(Application.StartupPath, "Resources");
string fullHtml = string.Empty;
string HeaderHtml = "<!DOCTYPE html>\n" +
"<html>\n" +
"<style>\n" +
".imgW {\n" +
"position: absolute;\n" +
"z-index: 10;\n" +
"color: red;\n" +
"width: 110px;\n" +
"height:30px;\n" +
"text-align: center;\n" +
"vertical-align: middle;\n" +
"top: 88px;\n" +
"background-color: aquamarine;\n" +
"font-family: Arial;\n" +
"font-size: small;\n" +
"}\n" +
"</style>\n" +
"<body style=\"background-color: #00000;\">";
string dynamixImg = "<div id=\"animation1\" style=\"display: inline-flex;\">\n" +
"<img src=\"file:///" + blah + "/{0}\" style=\"height: 110px; width: 110px;\" />\n" +
"<span class=\"imgW\">{1}</span>\n" +
"</div>";
string FooterHtml = "</body>" +
"</html>";
for (int a = 0; a < fileNames.Count(); a++)
{
fullHtml += string.Format(
dynamixImg,
fileNames[a],
fileNames[a]
.Replace(".gif", "")
.Replace("&", "&&")
) + "\n";
}
await webView21.EnsureCoreWebView2Async();
webView21.CoreWebView2.SetVirtualHostNameToFolderMapping(
"Resources",
#"C:\Users\admin\source\repos\wCondictions\bin\x86\Debug\Resources\",
CoreWebView2HostResourceAccessKind.Allow
);
webView21.NavigateToString(HeaderHtml + fullHtml + FooterHtml);
I've seen many places where it says to use the SetVirtualHostNameToFolderMapping but even with that it still says the same error.
So I am not sure what I am missing or misunderstanding about how to use the SetVirtualHostNameToFolderMapping in order to allow the images to load locally?
Ok, I will try again, my first answer was confusing.
You get the error because you use the file:// protocol.
It seems you have not fully understood the the use of SetVirtualHostNameToFolderMapping.
Once you have set the virtual server by calling SetVirtualHostNameToFolderMapping you should use that virtual server just as you use any other server on the internet. Do NOT use file://!
So all you have to do is edit your HeaderHtml and your <img src.
The HeaderHtml should include a <base> tag, which should point to your virtual server root:
<html>
<head>
<base href="http://Resources" />
</head>
That makes it very easy to build you dynamic <ìmg> tags, the source is simply the file name:
<img src="image.png" />
Now WebView2will translate it into a file path and fetch the image!
As a side note, you can also include files from sub-folder by adding the folder name in front of the file name, like this:
<img src="/subfolder/image.png" />
I'm using ASP.NET to make a website for a hotel and at this point to show the hotel rooms I've created a javacript file to generate div's, now I want to get the value of the room number that by clicking "learn more "transfer the value of the number of the room to the other page
I already tried to use cookies but it does not work
here's the js file that generates the div:
$(document).ready(function () {
$.get('http://localhost/quartos.php', function (data) {
var results = JSON.parse(data);
console.log(results);
for (i = 0; i < results.length; i++) {
var div = "<div class='col-sm col-md-6' height='600px' width='400px'><div class='room'><a href='' class='img d-flex justify-content-center align-items-center' style='background-image: url(images/Quartos/" + results[i].imagem + ");'></a><div class='text p-3 text-center><h3 class=' mb-3'><a href=''>Quarto " + results[i].descricao + "</a></h3 > <p><span class='price mr-20'>" + results[i].Preco_quarto + "\u20AC</span><asp:Label ID='Label1' runat='server' Text='ç aop'></asp:Label><span class='per'> por noite</span></p> <ul class='list'><li><span>Max:</span>" + results[i].Lotacao_Maxima + " Pessoas</li><li><span>Vista:</span>" + results[i].Vista + "</li></ul><hr><p class='pt-1'><button class='btn btn-primary' runat='server' onserverclick='btn_quartos'>Ver Detalhes<span class='icon-long-arrow-right'></button></span></p></div></div></div>";
document.cookie = "CookieName=" + results[i].Num_Quarto + ";";
$("#quartos").append(div);
}
});
});
and the cs of the "next" page:
protected void Page_Load(object sender, EventArgs e)
{
string num_quarto = Request.Cookies["CookieName"].Value.ToString();
}
You're overwriting the cookie to something new each time in the for loop, so the cookie is always going to hold the last result in results, despite what they select.
Although, using a cookie to pass info from one page to another isn't an ideal way to do what you want anyway.
A better way would be to make your "learn more" page able to accept a room number as a query string value.
Example: http://localhost/learnmore.php?cuarto=123
Then that looks up the room information and renders the information into the html.
In doing that, you can simplify the link in your div element to point to learmore.php?cuarto="+results[i].Num_Quarto and not have to repurpose the cookie functionality for a behavior it's not really meant for.
I have a web browser control that for some reason isn't loading my HTML:
string updatingChatHTML = ""
+ "<HTML> "
+ "<head>"
+ "<style>"
+ "body {"
+ " margin: 0px;"
+ " padding: 0px;"
+ " background: " + chatBackground + ";\n"
+ " Font-Family: Arial;"
+ " font-size: 11px; "
+ " text-align: left;"
+ "}"
+ "</style>"
+ "</head>"
+ "<body>";
txtChat.DocumentText = updatingChatHTML + "</body></HTML>";
(txtChat is my WebBrowser Control).
The weird thing is, it was working before I changed something, but I can't figure out what I changed that caused it to stop working.
I have a breakpoint set to just after the last line above, and I can see that updatingChatHTML has the proper value it's meant to, but txtChat.DocumentText still has a value of <HTML></HTML>\0.
I thought maybe it was an initialisation thing, so I added txtChat.Navigate("about:blank"); prior to any assignment, but it still doesn't work.
This event actually gets fired quite often though, and the first time/two times, it doesn't work, but after the form is finished loading it seems to, but it's already the last thing to happen on my Form_Load.
Any suggestions?
Attempting to set the DocumentText property when
no document is loaded
or the browser control is not in a ready state (e.g. currently loading a document)
will cause the property assignment to fail silently.
After calling the Navigate function you should monitor the DocumentCompleted event for notification of when the navigation operation completes.
I have HTML code stored in a database and would like to display (render) it onto a view.
I wanted to show it as a normal text page.
eg: **HTML:** <h3 style="font-weight: bold">Usage:</h3>
<p style="text-decoration: underline">Viewing of Form -</p>
Should be shown as: Usage:
Viewing of Form -
I have a button as view and when clicked, it should show me the page.
I am using entity frame work so i have written,
string url = ("view.aspx?id = " + page.ID + "&Text=" + page.Text);
ScriptManager.RegisterStartupScript(this, typeof(string), "OPEN_WINDOW", "window.open( '" + url + "', null, 'height=500,width=800,status=yes,toolbar=yes,menubar=no,location=no,scrollbars=yes,resizable=no,titlebar=yes' );", true);
and i have created a new page view.aspx and tried to use System.Web.HttpUtility.HtmlDecode(Request.QueryString["Text"]) to render the file.
But i am getting a blank page.
Please help me.
Thanks,
Can you confirm that page.Text has a value when it's being rendered?
If you are certain that the value page.Text is populated correctly (I'm assuming something like "view.aspx?id=1&Text=<h3>example post<h3>") then you may want to try encoding the string for the URL before returning it to the client.
string url = ("view.aspx?id = " + page.ID + "&Text=" + System.Web.HttpUtility.UrlEncode(page.Text));
ScriptManager.RegisterStartupScript(this, typeof(string), "OPEN_WINDOW", "window.open( '" + url + "', null, 'height=500,width=800,status=yes,toolbar=yes,menubar=no,location=no,scrollbars=yes,resizable=no,titlebar=yes' );", true);
Then make sure that you are getting encoded characters in your links on the client.
I have an IFrame embedding a youtube video. I want to create a textbox where user (admins) can paste a new src (URL) of video and the IFrame take the new source. Here is what I have so far:
protected void Edited_Click(object sender, EventArgs e)
{
// HtmlControl frame1 = (HtmlControl)this.FindControl("frame1");
string url = TextBox1.Text;
frame1.Attributes["src"] = url;
}
And in the html code is the Iframe:
<div id="video">
<iframe title="YouTube video player" runat="server" width="420"
frameborder="1" style="height: 265px; float: left;
text-align: center;" id="frame1"
name="frame1" align="middle"></iframe>
<br />
</div>
I don't set any src in the beginning but when I paste a URL in the textbox and hit the button, the Iframe doesn't displays anything.
Other responses don't answer the question, they provide an alternative. The question is how to set iFrame src from C#. I'll answer that here.
I'm all for "right tools for the job" and use that mantra a lot myself - but only when the other tools are "wrong". That hasn't been established here. Can someone provide a good technical reason why this should not be done in code-behind?
I think the issue #Pepys is experiencing might be due to something in the URL, which he hasn't provided yet. For example, maybe his URL includes ampersands or other characters which need to be escaped.
The following code works fine for me:
excelframe.Attributes["src"] =
#"https://r.office.microsoft.com/r/rlidExcelEmbed?"
+ #"su=-0000000000"
+ #"&Fi=zzzzzzzzzzzz!111"
+ #"&ak=x%3d9%26x%3d9%26x%3d!zzzzzzzzzz"
+ #"&kip=1"
+ #"&AllowTyping=True"
+ #"&ActiveCell='sheet1'!C3"
+ #"&wdHideGridlines=True"
+ #"&wdHideHeaders=True"
+ #"&wdDownloadButton=True";
You need to do this on the client browser, not server-side. I would suggest something like:
// (Add inside script element in head of page html)
window.onload = function() {
document.getElementById('<id of input>').onchange = function() {
changeFrameUrl();
}
};
function changeFrameUrl() {
var inputVal = document.getElementById('<id of input>').value;
document.getElementById('<id of iframe>').src = inputVal;
}
Hope this helps - it's off the top of my head though, so don't diss me if it doesn't work first time!