javascript - How to link public directory in external Js file -
in front end side can show public directory through "asset." here when user hover on image should show other image have shown through external js file. in external js file can't indicate public directory through asset. how do that?
<a href="https://www.facebook.com/" target="_blank"> <img id="facebook-icon" src="{{asset('frontend/images/icon/facebook-icon.svg')}}"> </a> // external js file
$(document).ready(function(){ $('#facebook-icon').hover(function(){ $(this).attr('src','images/icon/facebook-hover-icon.svg'); }, function(){ $(this).attr('src','images/icon/facebook-icon.svg'); }); });
you have define in layout (header if possible), base url in javascript, :
<script type="text/javascript"> var base_url = {!! json_encode(url('/')) !!} </script> so can in every js file linked after :
$(document).ready(function(){ $('#facebook-icon').hover(function(){ $(this).attr('src',base_url+'images/icon/facebook-hover-icon.svg'); }, function(){ $(this).attr('src',base_url+'images/icon/facebook-icon.svg'); }); }); or whatever want need base url of site.
Comments
Post a Comment