LATEST >>

Welcome Here And Thanks For Visiting. Like Us On Facebook...

EXEIdeas – Let's Your Mind Rock » HTML-CSS-PHP-JavaScript / JavaScript Codes » How To Highlight/Select All DIV/Span Content Using JavaScript?

How To Highlight/Select All DIV/Span Content Using JavaScript?

How To Highlight/Select All DIV/Span Content Using JavaScript?

The question is that “How To Highlight All Or Select All DIV Or Span Text Or Content On Mouse Click On Button Using JavaScript?” Many blogger, coder want this awesome code to give his visitor a relax to his finger by giving him button to highlight all content using one click instead of pressing the mouse button and scrolling right to left or left to right.By this code you can also provide visitor hardware(Mouse0 to a relax. It is also best for Coding Providing Site/Blog to make it awesome and stylish. It has also unlimited features, First see the features and DEMO on this page before proceeding, Just scroll down and see the DEMO.

Features:

1.) It Will Highlight All Or Select All DIV/Span/Textarea Content Using Button.
2.) Pure JavaScript Code.
3.) Easy To Use And Easy To Use.
4.) Quick, Quick, Quick To Load.
5.) 813 bytes Only JavaScript File Size.
6.) You Can Add Unlimited DIV Even On A Single Page/Post.
7.) You Can Also Add CSS Style On ID’s.
8.) It Will Also Remove Highlight All Or De-Select All DIV/Span/Textarea Content Also Using Button.
9.) Compatible With IE-5+ And All Other Browsers.
10.) Short And Simple Code With Easy Customization.

Recommended For You:
How To Change CSS .class Of A DIV On Mouse Hover?

How To Add In Blogspot’s Post?

1.) Go To Your www.blogger.com
2.) Open Your Desire Blog.
3.) Go To “Template”.
4.) Click “Edit HTML”.
5.) Now Find </head> In Template.
6.) Now Copy The Below Code And Paste It Before </head>.

<script type='text/javascript'>
// EXE-Select All - A Full Featured, Light-Weight, Highlight All DIV Content Script.
// Copyright (c) 2012 EXEIdeas International - admin@exeideas.tk
// View Tuotorial At: www.exeideas.com
function fnSelect(objId) {
fnDeSelect();
if (document.selection) {
var range = document.body.createTextRange();
range.moveToElementText(document.getElementById(objId));
range.select();
}
else if (window.getSelection) {
var range = document.createRange();
range.selectNode(document.getElementById(objId));
window.getSelection().addRange(range);
}
}
function fnDeSelect() {
if (document.selection) document.selection.empty();
else if (window.getSelection)
window.getSelection().removeAllRanges();
}
// This Is A Copyrighted "EXE-Select All" Code, Don't Try To Theft It Otherwise...!!!
</script>

7.) Click Save, Now You Are Done.
8.) Now Add A New Blog Post And Copy The Below Code There.
9.) Customize It And Published Your Post.

How To Add In Website’s Page?

1.) Just Go To Your HTML File.
2.) Now Copy The Below Code And Paste It Between <body> </body>.
3.) Save It, Now You Are Done.

<div id="execodediv0" >
+++YOUR ENCODED HTML CODE HERE+++
</div>
<center> <input type="submit" title="Highlight The Code" onclick="javascript:fnSelect('execodediv0');" value="Select All The Code" /> <input type="submit" title="Remove The Highlighting" onclick="javascript:fnDeSelect();" value="DeSelect All The Code" /> </center>

Customization:

1.) Change +++YOUR ENCODED HTML CODE HERE+++ With Your DIV Content.
2.) For New Div On The Same Page, Add This Code Again But Change execodediv0 To execodediv1 Or Respectively Increasing…
3.) Save And Done.

Recommended For You:
Pure Vanilla JavaScript Responsive Image Slider With Text Over It

You Like It, Please Share This Recipe With Your Friends Using...

18 Responses to “How To Highlight/Select All DIV/Span Content Using JavaScript?”

  1. Really great job hassan. I am interested to using it in my blog.

  2. Spinx Florida says:

    Java script plays a very important role in various aspects of the website and blogs. I really appreciate the mention of the Java script coding for highlighting and spamming the content in both website and blog and also providing information on how to use them in coding. It’s a very impressive and informative post.

  3. Arny says:

    When I Am Using It INto My Blog Then Both Buttons Are Working But There Is No Border Box Around The Code..

  4. Jehad Hussein says:

    very nice , thank for you

  5. Utkarsh Singh says:

    This comment has been removed by the author.

  6. Chintan Padmani says:

    hey i can’t understand how to use it……..
    plz plz help Me……….

  7. Hasan bro what is the conditional tag to stop appearing in-text into this div content just like exeideas?

  8. It’s 1000% Working Fine Thank You Sir…..

Leave a Reply

Your email address will not be published. Required fields are marked *