How do I make selectable A tag? - css

Is there any way to make the text within an <a> tag selectable, using CSS?
I can't seem to be able to search this query for useful results on the web, "a" just finds the word "a" :)
I don't control the original creation of the document.

Are you trying to do this in a XUL document?
If so, you're probably looking for the following CSS property:
-moz-user-select: text;
I've used that on "description" elements with success but never tried on an "a" element.

You're either literally trying to just select text inside of an anchor element as a user.
OR
You're trying to use JavaScript to select text inside an anchor for the purposes of utilizing that text.
If it's the first simply select the text just at the edge outside of the anchor, if the selected character is 49% of less closer to the anchor then the browser won't select that character.
If you're trying to use JavaScript to get the text of an anchor you'll want to look at my tutorial, try selecting text and then clicking on the anchor below. That should give you some much needed direction...
http://www.jabcreations.com/blog/javascript-parentnode-of-selected-text
If none of that helps it would greatly benefit yourself as well everyone else reading your question to communicate your goal with greater clarity.

The nature of <a> is a link on HTML.So when mouse clicked on the text inside <a> the trigger of the link automatically triggered. I think it could not archive just by CSS alone. JavaScript need here
Run JavaScript Code
may let you select the text and handle click (if necessary )

Related

Anchor Tag doesn't work because of animation

Goal: I need to set anchor tags for the wordpress-site: http://joy-academy.eu/programs/
I am using Visual Composer and there is some animation.
Problem: If I try to set an anchor tag, it scrolls to the right place but does not show the previous parts that are animated like here:http://joy-academy.eu/programs/#example or if I use a Plugin "scroll to Id", it just scrolls to a random place, like for example here: http://joy-academy.eu/programs/#cc
Details: The Wordpress Theme is "Zyen". Ref: https://themeforest.net/item/zeyn-multipurpose-wordpress-theme/8848292
Thanks for your help!
I see that your site is using the Zeyn theme.
That's the first place to look for coding style changes. Here's a demo example doing what I think you are hoping to achieve. http://djavaweb.com/selector.php?theme=zeyn-classic
This means don't use the button for an anchor. So, use the Extra id in the rows to correspond with the anchor link (#example).
Here's the directions to do this; just start after the steps about the menu items.
http://kb.detheme.com/knowledge-base/zeyn-faq-one-page-navigation/

Text Highlighting When Dragging From Other Elements

I am still stuck on a highlighting problem in IE 7/8. I have tried applying CSS from this question, changing the onselectstart event to return false, adding the attribute unselectable="on", and anything else I could find here on SO.
Then I came across this response to this question:
Once an element is unselectable, users cannot select from within that
element. However, they are still able to select either the text or the
box of the element by dragging into it from within another element
which is not unselectable.
I have tried to work around this by cancelling various events on
myElement (ondragenter, oncontrolselect, onmouseenter,
onselectionchange...), it didn't work.
This is exactly what I am trying to do. I have a raphael canvas object that the user can drag in order to draw. However, if they leave the canvas I do not want text in "outside" elements to be highlighted. I was wondering if anybody has found a hack for the quoted problem. I'm only having this problem in IE 7/8.
use JQUERY
$('#dragelement').onMouseDown(function(){
//YOUR CODE
});

Change dragging cursor

How to change cursor when dragging using only CSS?
div:active{
cursor:move;
}
This won't work because it will be automatically changed by the browser to a text cursor when dragging. So how?
http://jsfiddle.net/nick_craver/uZ377/1/
Not sure if it truly solves your problem, but this ( http://jsfiddle.net/garretruh/pJjd4/ ) seems get rid of the text-select cursor by not making text selectable at all. Then again, you might want users to be able to select your text.
I realize this is over a year old, but just change the * selector at the top of that JSFiddle to only match the element that you are dragging around. No Javascript required.

How to hide AspxTextBox?

On a radio button checked event, I hide the div by
document.getElementById("AltYukleniciDiv").style.visibility = 'hidden';
But, when I use it for an aspxTextBox, it doesn't hide it. Or when I use the ClientInstanceName instead of document.getElementById(" ")
UnvanText.SetVisible(false); this didn't work either. UnvanText is ClientInsanceName.
javascript crashes there. I put an allert after that and it never shows it. I have to do it because I hide a div, including everything in it, but it still shows the textboxes that has validation. I don't know how it is possible. Can you tell me a way to hide them all? It used to hide the div with all of its contents before I make some validation settings.
It sounds like asp.net is being 'helpful' and changing the IDs of your elements.
Give the text box the attribute ClientIdMode="Static", and it might fix it.
you can add a CssClass attribute to that text box then use it to find the element and hide it.
You can consider using jQuery, so you need to write a single line of code:
$(".MyHideClass").hide();
or set attribute style display:none
I can advice using Firebug (FF Extension) for debugging javascript

Can I proxy a select field with HTML and javascript?

Since <select> elements don't style in a predictable way, I was thinking about setting up a javascript/html proxy element to manipulate a hidden <asp:dropdownlist> field. The code that populates the select is beyond my control, but I don't want to render the actual field.
Does anyone have any experience or pointers with something like this?
This is a job for jQuery. What you want to do is roughly the following:
Use css to hide the select dropdown
Read out the options/values of the select element into a javascript array. jQuery is good at this.
Use jQuery to generate a ul element with an li element for each of the options
Use the many methods that are around for styling the ul element into a dropdown
Here is an example of someone who has done this: http://www.brainfault.com/jquery-plugins/jquery-selectbox-replacement/ . You can probably use his code almost as is. The example is a bit confusing because he styles the dropdown to look exactly like a select element. But if you start editing the css you can get it to look any way you want.

Resources