cross-browser

How do I detect support for contentEditable via JavaScript?

由 情到浓时终转凉″ 提交于 2019-12-09 10:56:42
问题 I've been searching for this for a couple of days now and so far, the best I can come up with is checking the list below. I really don't like to check for support based on User-Agent, especially since it can be spoofed. I've also heard of at least one instance where the list below is incorrect (noted below). Is Internet Explorer? Is WebKit? (But I've read that mobile Safari doesn't support it) Is Opera? Is Gecko and version >= 1.9? (meaning Firefox 3 or later) Is there a better method based

css form checkbox styling with checked and after tags [duplicate]

由 十年热恋 提交于 2019-12-09 10:11:53
问题 This question already has answers here : Can I use a :before or :after pseudo-element on an input field? (20 answers) Closed last year . I am trying to design a form without using JavaScript or JQuery. It includes a series of checkboxes. The idea is to display a certain gif after the checkbox if it is unchecked. Otherwise, display nothing after it. This is the code I have: input[type=checkbox]::after { content: url(images/unchecked_after.gif); position:relative; left:15px; z-index:100; }

Detect browser support fo Polymer

由 旧城冷巷雨未停 提交于 2019-12-09 09:48:06
问题 I'm using Polymer (version 0.5, might upgrade to 1.0 at some point) on a site. Obviously many older browsers don't work well with the Polyfills. Is there a way to test if the polyfills were successful in a specific browser? So, after the polyfill was done, is there some function, object, variable or anything that I can check to see if the polyfills worked? I want to be able to detect failure, and then redirect to a page with a, "please upgrade" message. The only alternative for me is to

Inconsistent textarea handling in browsers

由 不打扰是莪最后的温柔 提交于 2019-12-09 09:15:39
问题 Here's what I'm seeing for the markup provided below. None of the browsers are keeping the textareas in the container which is inconvenient but not that big of an issue. However, what is annoying is that no matter what I do I can't get rid of the bottom margin for the textarea in Chrome. Any suggestions? Here is everything in a fiddle: http://jsfiddle.net/radu/RYZUb/ Markup: <div id="wrap"> <textarea id="txtInput" rows="6" cols="20"></textarea> <div id="test"></div> </div> CSS: #wrap {

How to prevent CSS declaration dropped errors cross browser?

由 我是研究僧i 提交于 2019-12-09 08:52:01
问题 Hi I would like to know how to easily prevent dropped errors from appearing from debugging software such as webdeveloper plugin in Firefox. I get errors such as: Warning: Error in parsing value for 'filter'. Declaration dropped. Warning: Error in parsing value for 'font'. Declaration dropped. I understand I get these errors because Firefox does not support these CSS properties, but how do I drop them before hand so Firefox does not attempt to read them in the first place? I know I can create

remove borders around html input

由 独自空忆成欢 提交于 2019-12-09 07:51:50
问题 I want to create a search function for my web app. here are the looks on FF & IE, it is ok without strange border Firefox IE and here are the look on Chrome & Safari, it has strange border around the input element Chrome Safari Here is my html & css code <input type="search" id="generic_search" onkeypress="return runScript(event)" /> <input type="button" id="generic_search_button" /> the border:0 has been applied to all elements #generic_search { font-size: 14px; width: 250px; height: 25px;

Stop loading the page if Javascript is disabled

由 ℡╲_俬逩灬. 提交于 2019-12-09 06:50:27
I have a Rails web app (Online Examination System). I have disabled Right click, selection, copy etc using JavaScript in the examination interface. So, I want my app to detect whether JavaScript is enabled on interface start up. I have checked it by using <noscript> tag as follows. <noscript> <meta http-equiv="refresh" content="5"> <div id="noscript_message" style="color: white; background-color: red;"> It is detected that Javascript is turned off in your web brower. Please turn it on to load the page correctly. For more reference about how to turn it on, please refer <a href="http://www

Equivalent of div display inline-block for IE8, IE7 and older browsers

由 随声附和 提交于 2019-12-09 05:56:31
问题 This is a fairly generic question about cross-browser compatibility. At various points in a design I'm currenly working on the only way to achieve the layout and style that I want (without resorting to using images) is to use the display:inline-block css style option. However, this is not supported by IE8 and other older browsers and this results in my design beign broken. So there are two parts to my question 1 - Is there a method of achieving a similar or equivalent effect for IE8? 2 - If

How can I stop text from being selected?

由 旧巷老猫 提交于 2019-12-09 05:29:19
问题 In my web app the user can sometimes click the same button a number of times, skipping through messages and things, causing the </a> to be selected. So how can I prevent this using Javascript (jQuery) 回答1: This solution worked for me: http://chris-barr.com/entry/disable_text_selection_with_jquery/ $(function(){ $.extend($.fn.disableTextSelect = function() { return this.each(function(){ if($.browser.mozilla){//Firefox $(this).css('MozUserSelect','none'); }else if($.browser.msie){//IE $(this)

'Lato' font rendering odd in safari, not in chrome, or firefox

由 北战南征 提交于 2019-12-09 05:09:17
问题 Im using the 'Lato' font from google web fonts, and its displaying fine on all browsers apart from safari. Im using it in font-weight:100; here are some screen shots of the different browsers. Any idea what might be causing it to render extremely thin ? Or if theres a way i can set it to render in font-weight:300; for safari only ? Ive also made a js fiddle of the problem - http://jsfiddle.net/qLHuc/1/ FIREFOX CHROME SAFARI 回答1: I'm not sure why, but Safari is disabling subpixel antialising
订阅 cross-browser