简体   繁体   中英

How a user can manually increase or decrease font size of all the content in a page in SharePoint?

I am having a requirement where user can increase (A+) or decrease (A-) using a link or button click to effect the font size of entire content in a SharePoint page. I am using SharePoint Online (Office365) for POC. I have tried using content editor webpart with html and js as:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function()
{
$('button').click(function()
{
var theElement = $("div").css("font-size");
var textSize = parseFloat(theElement, 10);
var unitOfMeasurement = theElement.slice(-2);

if ( (this).id == "largerTextLink")
{
textSize += 2;
}
else
{
textSize -= 2;
};

$('div').css("font-size", textSize + unitOfMeasurement);

return false;
});
});
</script>
<body>
<div class="font-button">
<button id="smallerTextLink">Smaller Text</button>

<button id="largerTextLink">Larger Text</button>
</div>
</body>

but the above code is not reflecting anything and just the page is refreshed. As a junior developer I don't know whether I am going in a right path. Is there any way or alternative to solve this requirement?

You could use em 's for this.

Here is a good answer/example on a similar question: https://stackoverflow.com/a/16461139/3021549

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM