In my asp.net webform page I have a simple form with a single inputfield and a submit button. When initiating the post request and then hover over the submit button, the browser stops showing the loading state (progress bar dissapears, the "Done" label appears and the loading animation in the tab becomes the site icon again.
I have been able to narrow the bug down to the followihg css rule:
.button:hover {
background-image:url("/content/images/buttonHoverGradient.jpg");
}
on the following html
<input type="submit" class="button" title="Select a provider" value="Select">
It seems to me IE initiates the request to fetch the image and then takes the status of this new request as the overal status. I don't have a clue how to prove this. Any ideas?
UPDATE
The buttons class is used all over the page and we cannot know the dimensions of them on beforehand. Therefore using a single background as suggested by #teresko image with several states embedded is not an option.
UPDATE
It seems to be in other versions of IE too. Some research seems to point to the Doctype (which is currently quircks as asp.net webforms 3.5 doesn't really alow for strict)
Did you try to just use a same image for both normal and :hover state of the button , and only change the position of image on mouseover? Kinda like in this example.
This should solve at least part of the problem.
Related
I want to do some price monitoring on the page https://reiseauskunft.bahn.de/ but when I open/navigate, a coockie banner appears in the foreground and an acceptance buttton must be clicked, before any inquiries can be done. Using the inspect facility of the browser I have noticed the buttons are within a
#shadow-root (open)
Addressing the button directly e.g.
remDr$findElement('css selector', 'button.btn:nth-child(1)')
does not find the element.
Note: A solution using Python and the selenium module might help me to get on the right track.
I am working with a couple web applications, and one of them does not show the "spinning circle" status indicator in Internet Explorer when posting back a form. When navigating from one page to another, the indicator works; it always seems to work on the second application.
It took me awhile to figure out the difference, but it is because the first application uses frames. Navigating from page-to-page reloads the entire frameset, but a postback to any given webform only loads that frame. In this instance, IE 11 does not provide any status indicator. This is a problem on one specific form that does significant server-side processing--from a user perspective, you cannot tell that the form was even submitted.
Is there any way to force IE to show the status indicator in this scenario? Alternately, I can use Javascript on submission to show some "Please wait..." type message. I'd like to avoid that, as it is inconsistent with the rest of the application. Thanks!
Here is a simple jsFiddle showing a simple iframe of CNN. Notice that if you click links within that iframe, IE11 will show no status indicator that lets you know it is loading (normally the spinning circle on the tab).
https://jsfiddle.net/huokzjad/1/
Code:
<body>
<iframe src="http://cnn.com/" style="width: 90%; height: 300px;"></iframe>
</body>
Note that Firefox shows the loading status indicator properly.
Already posted this as a possible option in the question, but will include as my own answer:
As a workaround, you could have a hidden div with a "loading" type message. Upon submission, show the div using Javascript.
I'm running into an issue where for navigation, we have to use a custom back button, which we are matching to iOS7. So we're creating a UIButton with a background image and then setting it as a custom view of a UIBarButtonItem.
The issue is that when an Action sheet is presented by iOS7, the background is faded. However, the custom button does not and it looks mismatched. Question is - is there a property that can be set to provide the image for the faded state? (though this can be done with delegation, I wanted to see if there was a simpler solution before going that route).
I have tried to set a faded image for UIControlStateDisabled, UIControlStateSystem, UIControlStateReserved with no avail.
Screen shot below:
I ended up using delegation. When the action sheet is presented, my controller received a message and switched the button to faded. When action sheet was dismissed, my controller again received a messaged and switched button to normal.
Actionsheet was subclassed here, which is why I had to do this dance.
I have actually resolved this issue without delegation. The solution is to have a png with clear background. So just the blue of the back arrow. In that case, iOS handles the fading and desaturating. If you add background, it will not.
I use fileUpload control in asp.net web page, so how could I control the "browse" button, just like any other button?
etc. I want to change "browse button" back color, border style.
Thank you in advance.
how could I control the "browse" button, just like any other button?
What makes you sure there will be a browse button? That's up to the web browser; some might not have a text-plus-browse arrangment at all. In particular Safari arranges the control quite differently.
For reasons of security, and because there is no standardisation about what a file upload control should look like, CSS gives you almost no control of the style of file upload controls.
Whilst the opacity hack mentioned in phoenix's link does kind of work, I wouldn't recommend it at all. There's no guarantee of getting the ‘clickable’ part of the input control lined up with the part of your ersatz control that looks clickable. Even on a single browser, different fonts and other settings will mess it up. For example on my browser with the quirksmode example only the right half of the textbox is clickable to open the browse dialogue; clicking the faux-button does nothing and clicking the left edge of focuses the faux-textbox. With fake-input you will be offering a shoddy and in the worst case broken experience to many of your visitors.
Live with the default upload styling, or augment it with a Flash uploader in the progressive-enhancement manner.
You can add a div layer on top of the fileupload control and style the div layer. Make the file upload control transparent by setting its opacity.
A good one
Styling an input type="file"
I've run into a strange problem with an HTML form. I've built a dynamic table that adds a new row when you enter data into an existing blank row; because there are some server requirements in adding a row, I make an AJAX call to do this in the onblur event. It took a while to make this work for all browsers, but eventually all was happy with the world ... until IE8. Now, what happens is that, when the call returns from AJAX, the cursor shows in the next textbox (correctly), but the keyboard no longer works. I have to close the modal window (actually an IFRAME), then the keyboard starts to work again. If I put IE8 into compatibility mode, it works fine.
Has anybody seen behavior like this, or have any ideas for a workaround?
Thanks, Jim
I had problems with DIVs placed above an INPUT, that cloacked the cursor... and once the DIV was not above it, the cursor appeared back again.
Just an idea: Maybe your IFRAME captured the focus (and/or the keyboard).