1

I want a javascript function in which if i hover on text like "ExampleText" ,it will generate some random character with same length of hover Text like "$45a%b8r5c7" and every time it generate random characters.And if i unhover on text it will show me the old orignal text which is "ExampleText".

Amir Naeem
  • 570
  • 6
  • 23
  • 3
    please show us what you tried so far. – vijayP Oct 16 '15 at 11:25
  • This should be pretty easy to achieve, what's the question? People are not gonna do the coding for you unless you are stuck for real. – Danmoreng Oct 16 '15 at 11:32
  • I have this concept ,but i just need your people help for a starting step – Amir Naeem Oct 16 '15 at 11:37
  • Here are 4 links for you to read regarding to your "concept": [Javascript manipulating HTML DOM](http://www.w3schools.com/js/js_htmldom_html.asp), [onmouseover Event](http://www.w3schools.com/jsref/event_onmouseover.asp), [onmouseout Event](http://www.w3schools.com/jsref/event_onmouseout.asp) and [Generate a string of random characters](http://stackoverflow.com/questions/1349404/generate-a-string-of-5-random-characters-in-javascript). Sorry but you should at least try coding something yourself before asking someone else to do it for you. – Danmoreng Oct 16 '15 at 11:44
  • ok thanks for the steps – Amir Naeem Oct 16 '15 at 11:46

2 Answers2

3

Try this

$('body').on('mouseenter', '.change', function(){
    $('.change').html(Math.random().toString(36).substring(7));
}).on('mouseleave', function(){
    $('.change').html('Example');
});

<div class="change">Example</div>
Vinodhan
  • 110
  • 4
2

If you want to specify the generated characters, maybe you can use something like this:

https://jsfiddle.net/uk7xyapa/1/

Html:

<span id="originalText">ExampleText</span>
<span id="newText">ExampleText</span>

jQuery:

$(document).ready(function(){
    var originalText = $( "#originalText" ).text();
    $( "#originalText" ).mouseenter(function() {
        var text = '';
        var possible = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789%$';

        for(var i=0; i < $( "#originalText" ).text().length; i++)
        {
            text += possible.charAt(Math.floor(Math.random() * possible.length));
        }
        $( "#newText" ).text( text );
    });
    $( "#originalText" ).mouseleave(function() {
        $( "#newText" ).text( originalText );
    });
})
Nacho Moço
  • 460
  • 3
  • 7