CODEWITHSUNDEEP
jquery
sures
sures

Reputation: 1

the font-size doesn't changes when i use this function

<!DOCTYPE html>
<html>
  <head>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js</script>
<script>
   fontsize=function(){
       var fontsize=$(window).width() * 0.10;     
       $("p").css({'font-size' , fontsize});  });       
       $(document).ready(function(){
          $(window).resize(function(){
           $("p").fontsize();
          });
       }); 
 </script>
 </head>
 <body>
     <p>Here's the fontSize</p>
 </body>
 </html>

Upvotes: 0

Views: 24

Answers (2)

Jack jdeoel
Jack jdeoel

Reputation: 4584

can call window.resize directly ,if u change one css property use assign but more than one css use object style..

function fontsize() {
var fontsize = $(window).width() * 0.10;
$("p").css('font-size',fontsize);     //one css 
// $("p").css({'font-size':fontsize,  //many css
//            'color':'red'});      
}; 

$(window).resize(function () {  //use resize direct
    fontsize(); 
});

Upvotes: 0

Rohan Kumar
Rohan Kumar

Reputation: 40639

You have javascript errors in your code

  • Use $.fn. to when you call a function from jquery object
  • You are passing json object in css() so use : in place of ,
  • Remove an extra closing ) after fontsize function

Try the below code,

$.fn.fontsize = function () {
    var fontsize = $(window).width() * 0.10;
    $("p").css({
        'font-size': fontsize
         // you are passing json object here, so use : in place of ,        
    });        
}; // remove extra parenthesis after function closing
$(document).ready(function () {
    $(window).resize(function () {
        $("p").fontsize();
    });
});

Live Demo

And if you want fontsize would behave like a normal function then you need to change your calling way like,

var fontsize = function () {
    var fontsize = $(window).width() * 0.10;
    $("p").css({
        'font-size': fontsize
         // you are passing json object here, so use : in place of ,        
    });        
}; 
$(document).ready(function () {
    $(window).resize(function () {
        fontsize(); // simple function call
    });
});

Simple Function demo

Upvotes: 3

Related Questions