I am interested in creating a :disabled button that has loading gif which follows the text of the button. Example here http://jsfiddle.net/roman_khrystynych/YTBLs/
The idea is that when a user clicks the button it begins showing a loading animation next to the changed text. In this format the button is disabled. I would like to use this format for all the buttons on the site which means that the text will quite often change.
Because of this I would like the button to be structured in a way that would automatically position the loading gif next to the text.
Any suggestions on how to format this button so that in disabled format it shows the animation gif right next to the text?
You could use LABEL tags with a CSS background to go with the buttons. When the button is disabled, change the class name on the label to show the image.
I would do it like this:
<button>Submit<span> * </span></button>
Stick your graphic on/in the <span> tag.
Related
I am using SSRS 2008-R2
I have a textbox in a tablix/matrix, for usage as a menu bar, which links correctly to given reports (four to be exact).
The textbox is using a background image, to represent a button.
However, only the text inside the textbox is a link to the report, i want to be able to use the entire box, which is formed by the background image.
Is there a way to alter the 'action' so the entire box is clickable?
Alternatives, like using an image, is also very welcome!
You can't make the whole text box a link but you can put your Action on the Image instead.
In the Image properties, there is an Action tab that works the same as the Action tab on the text box which should work when the user clicks on it.
I have text that I need to link to where you click on it and an iframe window pops up with the content from an external site. I have found code that when I use it, a box appears above the text and the content shows in the box when clicked. But I need it to not show anything until the link is clicked.
<iframe name="book" src="https://www.timetrade.com/book/9PK2K"></iframe>
Book Now!
This is the code I used to try to get it to link to a pop up iframe window but it showed a box above the text.
You'll need to use some javascript for this.
A simple onClick() method that sets the display to 'Block' and 'None' to display and hide, respectively, should do the trick.
The javascript would set style.display="none" by default, and the onClick will be written to set style.display="block" or some un-hidden attribute.
Check out this http://www.w3schools.com/jsref/event_onclick.asp for onClick
and http://www.w3schools.com/jsref/prop_style_display.asp for using javascript to show/hide DOM objects.
Good luck!
This should have a really obvious answer but I can't figure it out...
I've made a button in Access 2007 that takes the user to a form (and other buttons that do other things). I've made the button's background an image so that I could have a gradient-style button but I'd also like to have text on top of this. There is text on the button but it gets hidden either because it's just a name given to the button for VB or because the gradient image is being place on top of it...
any ideas?
Access 2010, and Access 2007 supports both text and graphics on buttons.
Eg note the top buttons:
or simply this:
I do believe that transparency in 2010 is better supported, and the options for buttons in 2010 does include shadow and gradient options:
Eg:
I'm not sure how you did set picture as button background. Might be do you mean that you have two independent controls, an image and a button. In this case right click on the image and Position / Send to back. Back style of the button should be Transparent, but Transparent property should be set "No".
The process is like this as below.
a user choose some text and make selection on it. then it's gonna be highlighted.
the user move her mouse focus on the textbox on the html.
the highlight on the text in the html is still there.
If the user move her mouse back to the text, click somewhere on the text zone, the highlight would be gone.
The user can make another new highlight.
Here's my question.
Can I keep the highlight even though I change the focus on other object from text in the html?
I don't want to use span for it since if I want to make new highlight, it's tedious to move the span back out. Is there another way?
Try this: http://rangy.googlecode.com/svn/trunk/demos/highlighter.html?serializedHighlights=
In a HTML form I have a file field like this:
<div class="filefield">
<input type="file" name="myfile" id="fileinput">
</div>
It displays a button and some text besides the button. When no file has been selected yet, the text is: No file chosen. If there is a file already selected, it displays the name of the file.
This text displays on the right side of the button. I want it to display below the button. I have tried numerous things in CSS, and nothing works, the No file chosen just always displays on the right side of the button, even if both the div and the input are given fixed widths only as wide as the button, and a fixed height high enough for a button and two lines of text, the text still displays on the right, outside of the div, and not below where the is space inside the div. How to make it wrap so the text displays below the button?
With #Guffa's answer showing that you can't mess with that field, you could create a hack around it.
What about a button element, that on click acts like a file browser button? And then a span element that holds the value of that file browser input? It would be some js hackery for sure, but could solve the problem.
EDIT
Working example: http://jsfiddle.net/nmeAW/1/
Edit 2
Even more better working example: http://jsfiddle.net/nmeAW/2/
You can't. The file input field is a single control, even if it looks like several controls that could be controlled separately.
Besides, how the file input control is displayed depends entirely on what browser you are using. It's appearence is not specified in the standards, so any browser vendor can choose to display it any way they see fit.
You might look into jQuery and some of the upload file plugins that can help you "restyle" the input essentially by hiding it and activating/displaying file selected information in html.
http://www.tutorialchip.com/jquery/9-powerful-jquery-file-upload-plugins/
http://www.uploadify.com/demo/
http://www.plupload.com/example_queuewidget.php
http://blogs.bigfish.tv/adam/2009/06/14/swfupload-jquery-plugin/