Saturday 21 March 2015

Get Image Name from url using jquery

How to get image name from url ?

First add the jquery file by including following following line

Jquery library:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>



Html:

    <img width="75px" height="75px" border="0" alt="Top Tech" src="http://unitedassemblers.com/Artwork/Blank.jpg">



Jquery:

$(document).ready(function(){
    var name = $('img').attr('src');
    var fileNameIndex = name.lastIndexOf("/") + 1;
    var filename = name.substr(fileNameIndex);
    if(filename='Blank.jpg')
    {
     alert('image name is '+filename);
    }
})


Live Demo :

Click here for live demo

Friday 20 March 2015

How to add selected or active class to menu ??

If you want to add class selected or active to your menu just add the script in your project


Add jquery library using following url

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>


Html:

<ul id="main-ul">
   <li><a href="#">About MHG</a></li>
    <li><a href="#">Workout Programs</a></li>
    <li><a href="#">Fitness Tips</a></li>
    <li><a href="#">Contact Us</a></li>        
    <li><a href="#">Read Our Blog</a></li>
</ul


CSS:

li{list-style:none;}
.selected{background:red;}
.selected a{color:#fff;}


Script:

$(document).ready(function(){
    $("#main-ul li").click(function(){
        $('li').removeClass("selected");
        $(this).addClass("selected");
    })
})


For live demo click Here