HTML
<span id="firstName">Hemant</span>
<span id="lastName">Vishwakarma</span>
<div id="profileImage"></div>
CSS
#profileImage {
width: 150px;
height: 150px;
border-radius: 50%;
background: #512DA8;
font-size: 35px;
color: #fff;
text-align: center;
line-height: 150px;
margin: 20px 0;
font-family:Verdana, Geneva, sans-serif;
}
JS
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
var firstName = $('#firstName').text();
var lastName = $('#lastName').text();
var intials = $('#firstName').text().charAt(0) + $('#lastName').text().charAt(0);
var profileImage = $('#profileImage').text(intials);
});
</script>
How do i set profile image as first letters of first and last name
No comments:
Post a Comment