Advanced Search

Return to Snippet

Revision: 38476
at January 3, 2011 22:44 by aamirrajpoot
Initial Code 
function toggleSelectionBold() {
                var range, sel;
                
                if (window.getSelection) {

                    // Non-IE case
                    sel = window.getSelection();
                    if (sel.getRangeAt) {
                        range = sel.getRangeAt(0);
                    }
                    $('#news_bulletin_div').attr('contenteditable', 'true');
                    if (range) {
                        sel.removeAllRanges();
                        sel.addRange(range);
                    }
                    document.execCommand("bold", null, false);
                    $('#news_bulletin_div').attr('contenteditable', 'false');
                } else if (document.selection && document.selection.createRange && document.selection.type != "None") {
                    // IE case
                    range = document.selection.createRange();
                    range.execCommand("bold", null, false);
                }
                
            }
Initial URL 

                                

                                                            

                                    

                                        

                                        Initial Description
                                        

                                    

                                    
Create a div with 'news_bulletin_div' as ID and add css as you like, add Bold button infront of it using float (or what ever where ever)

Add toggleSelectionBold on that button.

Now select a part of text within the DIV and click bold. It will bold it, again select the same bold text and click bold button and it will un-bold the selection.

Cheers.

                                

                                                            

                                    

                                        

                                        Initial Title
                                        

                                    

                                    
WYSIWYG Bold effect on a DIV, Span etc.

                                

                                                            

                                    

                                        

                                        Initial Tags
                                        

                                    

                                    

                                

                                                            

                                    

                                        

                                        Initial Language
                                        

                                    

                                    
JavaScript