I have a web app built in asp.net/vb. The scripts on the site only work properly with IE. Is there a way to force the user to use IE all of the time on the site?
You should not. Are you really willing to ignore 75% of the traffic? or are you paid by microsoft and have got a really cool website idea? Any ways, you can do that by using javascript and detecting the browser and if its not IE then do not show anything(Make you main div "display:none"). Here is an example http://www.w3schools.com/js/js_browser.asp to detect browser. Yet again these approaches are used for customizing styling for browsers and not for what you want it to.
function detectIE()
{
var isIE=navigator.userAgent.toString().indexOf("IE") != -1
if(isIE)
{
document.getElementById("main").style.display="block";
}
else
alert("This website can only be accessed using Internet Explorer");
}
<body onload="detectIE">
<div id="main" style="display:none;">
//Everything inside this div
</div>
</body>
Another approach is by using conditionals
<!--[if gte IE 6]>
<div id="main" style="display:none;">
//Everything inside this div
</div>
<![endif]-->
Remember, it's not a 100% solution, browsers can change there user agent strings and present themselves as IE or javascript can be turned off. You should consider adding support for other browsers rather than ignoring them completely.
Related
Recently, a visitor complained about some DIV overlaying the page content.
A popup that actually only should display when the mouse hovers over its container:
<td class="ref" id="myContainer">
<div>link text</div>
<div style="position:absolute;width:200px;background-color:white">
<?php include 'div-content.php'; ?>
</div>
<style type="text/css">#XcatContainer > div { display: none } #XcatContainer > div:first-child, #XcatContainer:hover > div { display: block }</style>
</td>
works like a charm in all my browsers on Windows 10 and Linux including IE11. However, it does NOT work in IE11 on Windows 7 (and IE 6 on Vista).
Now I´m considering a browser switch to disable the popup in those browsers. I could use [!if IE]; but I guess I need JS or PHP to only add that on older Windows.
Or could some reformatting make it work?
You'll indeed need PHP to filter out the OS from the UserAgent.
There's more info in this answer by Funk Forty Niner.
Internet Explorer misinterprets website: it reads <tag></tag>bla bla</tag><//tag> instead of <tag>bla bla</tag>. For instance the code of the nav section is:
<nav>
<ol>
<li><form action="Algemene Voorwaarden Bijles Studio.pdf" method="get" target="_blank">
<button>algemene voorwaarden</button>
</form>
Bla Bla
</li>
</ol>
</nav>
But the inspect element function of IE shows the following:
<nav></nav>
<ol>...</ol>
</nav><//nav>
And this doesn't only happen with the nav tags, it also happens with figcaption, section, footer and other tags, for instance the IE inspect element shows:
<figcaption></figcaption>
Onze bijlesdocenten
</figcaption><//figcaption>
Furthermore the website works fine in Google Chrome and other browsers.
The url of the site is: http://www.bijlesstudio.com
Comment: I asked this question on ProWebmasters, but they send me here because the mod thought it was an CSS problem, so don't delete this post for being a duplicate s.v.p.
Regards,
Jens Wagemaker
One thing that can be happening is that you are using Internet Explorer in
IE8 or older document mode which do not support the new semantic elements of HTML5.
Can I use... Support tables for HTML5, CSS3, etc
To resolve:
check and change the document mode to IE9+ by right-cliking on the page->inspect element->(look around the right top corner in the inspect elemnt section) select Edge from dropdown.
OR
you can add this to your pages <head>...</head> section
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
as common sense would tell, this is a much better option than the previous one.
There is a space <ol > which might be part of it but your editor is inserting a few Byte-Order-Marks which may be messing with IE. Check your editor's settings to turn that off.
Always validate your HTML to find such things.
IE8 won’t display background images on a div.
My HTML:
<section class="section-divider textdivider divider1">
<div class="container">
<h1>Info About The Foundation</h1>
<hr>
<p>Microfestival stable energy fields natural homebirth sarong watsu, aura discovering valuable truths. Nature equinox forest, feline acupuncture salvia. Didgeridoo prius what the planet really needs, divine feminine compostable toilet change agent closing circle feeling deep gratitude sustainable rain dance prayerformance. Beltane perineum cuddle party, bioneers radiant.</p>
More About The Foundation
</div>
</section>
My CSS:
.divider1 {
background-image: url('../images/bg/divider1.jpg')
}
In IE8 the image doesn't even load. It just displays the text without any styles being used at all. Is it because IE8 cannot read images for a div? I've looked around and didn't see any indication that IE8 cannot do this.
Remember, <section> is a new HTML5 element, meaning IE8 does not automatically recognize it. Have you A) added an html5shiv and B) set the display property in CSS?
HTML5Shiv
<!--[if lt IE 9]>
<script>document.createElement("section");</script>
<![endif]-->
CSS
section { display:block; }
90% of the time, the reason my new projects won't work on IE8 is because I forgot to add these two.
I want to display a google map in IFrame with scrollbar.
<!DOCTYPE HTML>
<html>
<head>
<title></title>
</head>
<body>
A website
<br />
<iframe src="http://parkall.hu/teszt/parkolok/index.html"
style="overflow: scroll; width: 540px; height: 630px;"></iframe>
</body>
</html>
It works in the latest firefox (v17), but not in Chrome (v23), strangely enough Chrome displays scrollbars for a moment and hides after that. The scrollbar is still useable if you find out to grab an invisible thing....
Have you ever noticed this? Maybe it can be solved with a CSS but i was unable to find out, the scrolling="yes" attribute is not supported in HTML5. And of course if I change scr to wikipedia.org it displays scroll bar.
There is a decent chance that google maps tries to disable the scrollbar from its iframe with javascript. In that case you will need some javascript of your own to counter that a few seconds after pageload (by using setTimeout()).
What you need to change in your setTimeout depends on what is happening that hides the scrollbars. Since the example is not complete, I can't determine what happens exactly.
Please put your code in jsfiddle.net and reply with the link so we can check the exact problem.
i am working on an mvc page that allows users to securely logon via a colorbox modal window. the modal is layed out something like this:
<html>
<body>
<div id="overlay" style="display: block;" class="overlay"> <div>
<div id="colorbox" style="display: block;">
<iframe id="logonIFRAME">
logon form is in this ssl iframe
</iframe>
</div>
<div id="restofpage"> </div>
</body>
</html>
thats the basic layout.
what happens is when the iframe form is authenticated, it calls parent.$.fn.colorbox.close() which closes the modal and reloads the parent page.
now the problem is the colorbox.close script is in the parent page (not the iframe) so it cannot be called from the iframe due to the protocols being different (https and http).
so how can i either call the script cross protocol (which i believe you cant do) or from the iframe set the colorbox div's display attribute to none and hiding the overlay. this would hide the modal just as well but can the code in the iframe talk to the parent pages html? if it could i would use something like:
$('#colorbox').attr('style', 'display: none;');
but that jquery doesnt work.
anyone got any ideas on how best to proceed?
It's kind of Hack i think of... On success login redirect to normal page mean having http, and in that you write your code to call parent windows by simpally adding javascript.
I found this is working for me, hope it works for you too. however it's not pure solution but just a workaround
Imran