how can i show a message when click on phone number ???

[shawn.hossan]

1st thing  >> how can hide phone number last 3 digit and after mouse hover on phone number show a message like this image bellow



after click on the phone number as showing the top image... will show anather message as showing bellow image



please give me solution

im using modern theme

[calinbehtuk]

here are some methods:

You can translate it into your language site to better understand.

here's the code I've used them in theme modified by me, I replaced the city with phone number

Code: [Select]

<?php if ( osc_item_city_area() != "" ) { ?><li class="phone_icon"><?php _e("Telefon", 'modern'); ?>:
<strong><span id="numbere" data-last="<?php echo osc_item_city_area(); ?>"><span>07<font style="color: red;">XXXXXXXX</font></span><img id="imaginenumar"style="float:right;margin-right:20px;" title="Arată numărul de telefon" src="<?php echo osc_current_web_theme_url('images/telefon2.png') ; ?>"/></span></strong>
</li><?php } ?>                       
<script type="text/javascript">
$('#numbere').click(function() {
                       $(this).find('span').text( $(this).data('last') );
   
                   });
                   
                   $(document).ready(function() {
                      // reveal the tag with id="numbere", when the tag with id="imaginenumar" is clicked
                      $('#imaginenumar').click(function(){
                         $('#numbere').show( function() {
                        $('#imaginenumar').hide();
   
                      });
                           });
                             });
</script>
You can download the theme from this link for a better understanding. Changes are made ​​to the file item.php

[shawn.hossan]

bro im not finding this script..

but its very helpful


thanks for reply me with a helpful script

[calinbehtuk]

The script is in the code above, but you can follow this script in use at this address
http://www.ascultamp3.ro/imobiliare/camere-de-inchiriat/inchiriez-camera_i6
Green arrow shows the number of phone.
 

[shawn.hossan]

when i will mouse hover on the hiden phone number then show a text at the top,,,

after click the hiden phone number will show this number and change the text also....

at a time...

please check the tatiana theme