PDA

Zobacz pełną wersję : Jak zrobić powiększenie tekstu?


egodon
06-08-2012, 13:58
Potrzebuje zrobić możliwość powiększenia tekstu jak tutaj: http:// www .zurs.com.pl/?s=iwr.


:zagubiony:
ekumi
06-08-2012, 14:33
Tutaj masz kod stronki a w niej skrypt z szablonu beez20, który to robi. Poprzypinaj do czego potrzebujesz i powymiataj niepotrzebne znaczniki.


<html>
<head></head>
**********
/*global window, localStorage, fontSizeTitle, bigger, reset, smaller, biggerTitle, resetTitle, smallerTitle, Cookie */
var prefsLoaded = false;
var defaultFontSize = 100;
var currentFontSize = defaultFontSize;
var fontSizeTitle;
var bigger;
var smaller;
var reset;
var biggerTitle;
var smallerTitle;
var resetTitle;

Object.append(Browser.Features, {
localstorage: (function() {
return ('localStorage' in window) && window.localStorage !== null;
})()
});

function setFontSize(fontSize) {
document.body.style.fontSize = fontSize + '%';
}

function changeFontSize(sizeDifference) {
currentFontSize = parseInt(currentFontSize, 10) + parseInt(sizeDifference * 5, 10);
if (currentFontSize > 180) {
currentFontSize = 180;
} else if (currentFontSize < 60) {
currentFontSize = 60;
}
setFontSize(currentFontSize);
}

function revertStyles() {
currentFontSize = defaultFontSize;
changeFontSize(0);
}

function writeFontSize(value) {
if (Browser.Features.localstorage) {
localStorage.fontSize = value;
} else {
Cookie.write("fontSize", value, {duration: 180});
}
}

function readFontSize() {
if (Browser.Features.localstorage) {
return localStorage.fontSize;
} else {
return Cookie.read("fontSize");
}
}

function setUserOptions() {
if (!prefsLoaded) {
var size = readFontSize();
currentFontSize = size ? size : defaultFontSize;
setFontSize(currentFontSize);
prefsLoaded = true;
}
}

function addControls() {
var container = document.id('fontsize');
var content = '<h3>'+ fontSizeTitle +'</h3><p><a title="'+ biggerTitle +'" href="#" onclick="changeFontSize(2); return false">'+ bigger +'</a><span class="unseen">.</span><a href="#" title="'+resetTitle+'" onclick="revertStyles(); return false">'+ reset +'</a><span class="unseen">.</span><a href="#" title="'+ smallerTitle +'" onclick="changeFontSize(-2); return false">'+ smaller +'</a></p>';
container.set('html', content);
}

function saveSettings() {
writeFontSize(currentFontSize);
}

window.addEvent('domready', setUserOptions);
window.addEvent('domready', addControls);
window.addEvent('unload', saveSettings);
</script>
</head>
<body>
<p>
<a onclick="changeFontSize(2); return false" href="#" title="Zwiększ rozmiar tekstu">Zwi&eogon;ksz</a>
<span class="unseen">.</span>
<a onclick="revertStyles(); return false" title="Przywróć styl domyślny" href="#">Wyzeruj</a>
<span class="unseen">.</span>
<a onclick="changeFontSize(-2); return false" title="Zmniejsz rozmiar tekstu" href="#">Zmniejsz</a>
</p>

<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam adipiscing, eros id pellentesque aliquet, mauris sapien suscipit ipsum, nec imperdiet ante velit eget lorem. Integer id lacus odio. Donec vehicula elementum eros, eget adipiscing mi ultricies sed. Cras nunc nunc, lobortis et volutpat vitae, molestie ac nisi. Aliquam id venenatis lectus. Curabitur at purus nisl. Etiam adipiscing ullamcorper ornare. Aliquam erat volutpat. Morbi condimentum lectus ut odio lobortis molestie dapibus et orci. Suspendisse cursus, eros quis hendrerit interdum, lacus nunc pretium nisi, sit amet viverra purus lacus ac purus.</p>

</body>
</html>
egodon
06-08-2012, 14:39
Dzięki :)
ekumi
06-08-2012, 14:50
Tylko w miejsce gwiazdek wstaw znacznik rozpoczęcia skryptu, bo go wycięło.