Hai,
I have seen something that when mouseover is done on a link/word in a HTML page, an information will be popping up.
Can any one post some sample code or link to achieve that.
Thanks in Advance.
Here's a list of 10 plugins, which might be interesting:
http://www.reynoldsftw.com/2009/03/10-excellent-tooltip-plugins-with-jquery/
or - if you want to add tooltips to links - just use the title attribute:
Hello
Well that depends entirely on what javascript framework you use.
For instance in jquery, this plugin tooltip(http://jquery.bassistance.de/tooltip/demo/) makes it trivial to do this.
If you are not using any frameworks then use onMouseover etc.
eg
Link
You could use JQuery QTip to accomplish this.
Source and examples here
You can use the standard HTML attributes
<img src="path_to_image" title="Information tip about the image"/>
Or use JS librery to produce more friendly tooltips
jQuery with a tooltip plugin
Prototype with a tooltip extension
To add a tooltip to anything, use the tag <acronym>, or in german: (great html reference page). Style with css if necessary.
Related
for my HTML5 web application (PHP) I need some input widget for tags like many modern tools have them. For example here a screenshot of Jira label list:
No idea how this widget type is named. I thought maybe it's possible to style with a HTML5 form? Any ideas? I tried to search in goggle, but "tag" and "html" together is a bad search combination. :-)
Hmmm, I just found out by reverse engineering the code of this web page from the tags input below I get some ideas...
But does anyone know an easier example?
enter image description here
You can use jquery autocompleter:
https://jqueryui.com/autocomplete/
And style it whatever you want
I want to use the SLDS picklist found here.
I'm using several other SLDS elements in my page and they work fine, I have included the necessary SLDS css.
The picklist doesn't actually work in the example they provide so I'm wondering if there is additional configuration required? The documentation does not mention any.
Can anyone tell me what the problem is?
As of my understanding after reading the SLDS documentation the SLDS is just a CSS "framework". For the picklist to work (open) you need to include some Javascript and more specifically the picklist is "opened" by adding a class slds-is-open to the element (picklist). Apply the class to the div stated below.
<div class="slds-picklist slds-dropdown-trigger slds-dropdown-trigger--click slds-is-open" aria-expanded="true">
I can't really make a demo out of this since the SLDS is so complicated to install but hopefully this can help you.
Well those dropdowns require some kind of javascript or jquery so there should be a file you have to include. CSS just styles the content it doesen't make it work XD
if you not comfortable with JS you can use this JS library
or add slds-is-open class on click event
If you are working with desktop application only (no SalesForce1), a simple way to make it work without adding code is removing the trigger--click
Just let the div like this:
<div class="slds-dropdown-trigger slds-is-open"> *//your list//* </div>
And it will work when you put your mouse over the icon.
It will have a weird behavior in SalesForce1 because you can't put your finger "over" without "clicking" the screen, keep that in mind.
PS: slds-dropdown-trigger is deprecated at the moment in SLDS documentation, keep that in mind too.
i created a site, And added pages to my site, since page size exceeds i need to create pagination in html i have created this method
123
in this way i created
Problem is when i add new page i need to replace all code again like this
1234
ever time when i add new page i need to replace all code is ther a way to do this without PHP
Can sombody help me any idea to do this in html
Do not re-invent the wheel. Use datatables, they provide sorting, pagination (client side and server side), export and a number of additional features.
http://datatables.net/
Include the files and just add this.
$(document).ready(function() {
$('#example').dataTable();
} );
This is a very basic and good example, you should go for it.
http://datatables.net/examples/data_sources/dom.html
This cannot be done purely in HTML. You must use something like PHP, or you could use Javascript.
You can make just one HTML file called "Pagination.html" include all your links there and then include that Pagination on every page using one of the following methods.
You can use Javascript: javascript
Or you can use html5: html5
Or there are also, others solutions to solve your problem like this: other
You better use some Javascript oriented solution, html5 support for including files still very poor.
unfortunately, this won't be possible without using some other technology that is not HTML. You can dynamically generate pages using javascript (JS), PHP or other technology, but not just raw HTML.
You can name your pages something like:
page_1.html
page_2.html
and then whichever editor you are using probably has a search & replace function, so you could use that to speed up things. I hope this helps.
I need to disable a submit button and innerText by using angularJS,
but jquerymobile wrap the input tag in div.
If I don't want the wraping,or render the by my self,how can i do that?
Use
data-role="none"
as an attribute on that button.
There are several other methods and you can find them here or here, just look for an topic: Methods of markup enhancement prevention
In a regular select box you can show the full title on mouseover using "title" attribute in the "option" field.
In Apache Struts, you make the select box with the "html:options" tag. I don't think this tag supports the "title" attribute. Is there another way to show the full title of an option on mouseover for the "html:options" struts tag?
Thanks
Struts' tag for <select><option>.. is <s:select />, or <s:doubleselect /> for double lists. <s:doubleselect /> doesn't support title at all, you have to modify the Javascript it generates by hand (ddoubleselect.ftl).
For with the default theme, the file is found in struts2-core-2.1.6.jar under template/simple/.
hard code in html or jsp file is a bad code practice.
if you are writing code in struts 1.x try to store all messages in MessageResources_en.properties
try update your jsp with following (alternatively go for )
title="<bean:message key="your_tool_tip"/>
and modify MessageResources_en.properties
your_tool_tip=toolTIp is a cool idea
ps there are solutions available in jquery as well
I'll admit to not being familiar with Apache Struts. If nobody more familiar can find you a better solution then worst case you could do it as a javascript tooltip. It's more effort, but gives you more effective visual control over the presentation.