This question already has answers here:
How do I create an HTML button that acts like a link?
(35 answers)
Closed 6 years ago.
I coded
<a class="link, btn"(styles that I made) href="">About me</a>
But I don't know what to put in the href.
Can anyone help?
Thanks!
html buttons don't really have hrefs. They are usually within a form and the form has the href in it. If you don't have a form and you just want the 'look' of a button you can use this code:
<style>.button { background: grey; color: black; }</style>
then in the body where you want your link
Oh yeah baby!
..... down the page somewhere
you can also use (s)
Just keep in mind you can only have one unique id per page. Dont give two elements the same id.
The link will now 'jump' down the page to the 'anchor'
You can use sites like this one to generate prettier buttons than that one! http://css3buttongenerator.com/
If you need clarification just ask, good luck!
Related
This question already has answers here:
How to get CSS to select ID that begins with a string (not in Javascript)?
(5 answers)
Find all elements whose id begins with a common string
(5 answers)
Closed 8 months ago.
On my website I have an AJAX search form. The HTML code displays this ID:
id="edit-field-geolocation-proximity-center-geocoder--Bq5Bx8zXA1A"
I want to apply a style to it. My problem is that the code at the end of Bq5Bx8zXA1A changes with each search.
How to style all ID starting with :
id="edit-field-geolocation-proximity-center-geocoder--"
UPDATE
Here is my current CSS code, it works on non-AJAX forms. But for those who have AJAX enabled, it doesn't work because there is a random code added to the background of the ID :
#edit-field-geolocation-proximity-center-geocoder .form-item {
margin-top: 0rem;
}
enter image description here
Welcome to Stack Overflow! I can help with that. One way to achieve what you are looking for in pure CSS is with an attribute prefix selector (which uses a form of regular expressions). In your case the following would likely do the trick:
[id^="edit-field-geolocation-proximity-center-geocoder"] .form-item {
/* your styles here :) */
}
This thread offers a lot of additional excellent methods on how to use regex in CSS if you would like to do some additional reading.
This question already has answers here:
How to scroll an HTML page to a given anchor
(17 answers)
Closed 8 years ago.
I want browse directly to my site div by this way:
www.xyz.com/#divname
some sites I saw , I know there is a way to do it ,can anyone tell me the code
I have tried
window.location.href=#divname
but not scrolling.
Try
window.location.hash = '#divname';
Where #divname is the id of your div
Can you try this,
<body onload="window.location.hash = '#divname';">
That is called bookmark links, see here http://www.hyperlinkcode.com/bookmark.php.
To navigate to an anchor via javascript you can use this code:
window.location.hash = "#divname";
This topic is also a duplicate of the following:
How to scroll HTML page to given anchor using jQuery or Javascript?
Regards.
If you want to browse directly using a URL (as per your question), then there is absolutely no need for any javascript.
All you need to do is set an id for your div elements, that match the anchor tag you want to use. In the case of your example:
www.xyz.com/#divname
Then you would need an element like so:
<div id="divname">
</div>
Here is a working example
This question already has answers here:
Custom attributes - Yea or nay?
(15 answers)
Closed 9 years ago.
I am working on a website using HTML5. I have a jQuery script that shows a custom tooltip on all elements that have the title attribute. I also have a script that makes an alert message appear when the user clicks a picture. The alert message will say what the title attribute equals. Unfortunately the tooltip script and the alert script interfere with each other.
My question is:
Can I make up an attribute?
Not exactly, but HTML 5 provides data-*.
In html5 , use data-XX to produce extra attributes.
see : http://www.w3.org/html/wg/drafts/html/master/dom.html#embedding-custom-non-visible-data-with-the-data-*-attributes
You can make an aditional attribute, just by naming it.
<img src="abc.jpg" data-opens="abc" data-test="abc" id="image" />
And access it in jQuery by typing
$("#image").attr("data-opens")..
Like:
alert($("#image").attr("data-opens") + " " + $("#image").attr("data-test"));
Edited, thanks to GCyrillus.
Specifically answering you question: you can make up attributes.
But your HTML will no longer be valid and since you are adding them just to store information, you should use de data-* form to add you own data storage for an element, plus it will still be a valid HTML
This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
change text on button using jquery mobile.
I need to change a button text, I am using jQuery mobile.
Here is my html:
<fieldset>
<div><button type="submit" id="login_var">Login</button></div>
<div><button type="reset" >Reset</button></div>
</fieldset>
I have tried all of the examples on this page:
LINK and nothing is working for me.
Please help
I've had to do the same thing before, it's really not as obvious to do as it should be. Since jQM adds span tags inside your button, you need to change the value inside the span:
$("#login_var .ui-btn-text").text("NewText");
Similarly, if you wanted to change the icon, you could do:
$("#login_var .ui-icon").removeClass("ui-icon-arrow-l").addClass("ui-icon-arrow-r");
Edit:
Sorry I just noticed the link you posted in the question has the same solution, and you said that doesn't work for you. Maybe if you changed your buttons to
<a data-role="button"></a>
Instead of <button></button>?
Yeah you can use
$(function(){
$('#login_var').text('Ok').button('refresh');
});
As per http://jquerymobile.com/test/docs/buttons/buttons-methods.html, there are only three methods you can call on a button.
This question already has answers here:
Closed 12 years ago.
Possible Duplicate:
Changing a CSS rule-set from Javascript
Dear experts,
Is there a way to dynamically generate a CSS stylesheets using Javascript according to what the users fill in on a form (user interface)?
If this isn't possible with Javascript, could someone point me to the right direction. Ruby on rails would also be fine.
Thanks
Sure you can. But you have to validate the user input. And write some kind of a css-processor to search the input text for the elements themselves and the according css-rules.
Finding css-rules is easy - they are all inside the braces {...} and the elements to which you apply the rules are outside the braces {...} .an .element {...}
You'll end up with something like this css playground
Yes you can do that.. Lets say you have a input fields.. and whenever user changes value in the input field, then you want to add some special css..
$('#form input').change(function(){
$('#someElement').css({
'background-color': 'green';
});
});