Версия для слабовидящих со сменой CSS'ки
 

Здравствуйте.

Есть скрипт, написанный специально под uCoz сайты, который активирует версию для слабовидящих (подскажите, пожалуйста, как сделать спойлер):

var timg = '',
	tf = '',
	bd = '',
	bd1 = '',
	bd2 = '',
	hmw = '',
	ac = 0,
	bbg = 0,
	mf = 15,
	al = '',
	ab = '',
	mpf = '',
	lgs = {};

function uhpv(a) {
	if (a) {
		hsc('uha', 'a')
	}
	if (uhe && hgc('uha')) {
		if (hgc('uhf')) {
			mf = hgc('uhf')
		} else {
			mf = fonts[0]
		}
		if (hgc('hpvbg')) {
			bbg = hgc('hpvbg')
		}
		if (uhe !== 1) {
			mpf = 'fixed'
		}
		if (hwidth) {
			hmw = hwidth + 'px'
		} else {
			hmw = '100%'
		};
		bd1 = '<div id="hpvgd" style="position:' + mpf + ';"><div id="hpvdiv" class="h-mdiv" style="width:' + hmw + ';"><div style="display:table-cell;" id="uhvv"><div id="fsd" class="h-ldiv">' + lg(lng, 3) + ' </div><div id="vimg" class="h-ldiv" style="display:none;"><span class="hswm"> | </span>' + lg(lng, 4) + ' </div><div id="vbg" class="h-ldiv" style="display:none;"><span class="hswm"> | </span>' + lg(lng, 5) + ' </div><div id="vch" class="h-rdiv" style="display:none;"><a href="javascript:uvcl()" class="uhpv-l" id="maf">' + lg(lng, 6) + '</a></div></div></div></div><div id="h-f"></div>';
		if (uhe == 1 || uhe == 2) {
			bd = bd1
		} else if (uhe == 3) {
			bd = bd2
		}
		if (!$('#hpvdiv').text()) {
			if ($('#puzadpn').text()) {
				$('#puzadpn').after(bd)
			} else {
				$('body').prepend(bd)
			}
			for (var nf = 0; nf < fonts.length; nf++) {
				if (fonts[nf] == mf) {
					al = ' h-al'
				} else {
					al = ''
				};
				$('#fsd').append('<a href="javascript://" onclick="uHPV(' + fonts[nf] + ',this)" id="maf" style="font-size:' + fonts[nf] + 'px !important;" class="uhpv-a' + al + '">' + lg(lng, 7) + '</a> ');
				if (nf == fonts.length - 1) $('#hpvdiv').show()
			}
			if (imgs) {
				if (hgc('hpvi')) {
					timm = lg(lng, 1);
					$('img:visible').addClass('h-ni')
				} else {
					timm = lg(lng, 2)
				}
				timg = '<a href="javascript://" onclick="uHPI()" class="uhpv-l hvit" id="maf">' + timm + '</a>';
				$('#vimg').append(timg);
				$('#vimg').show()
			}
			if (bg) {
				if (bgs.length) {
					for (var nb = 0; nb < bgs.length; nb++) {
						if (bgs[nb] == bbg) {
							ab = ' h-ab'
						} else {
							ab = ''
						};
						tf += '<a href="javascript://" onclick="uHPB(' + bgs[nb] + ',this)" class="h-background-' + bgs[nb] + ' h-fi' + ab + '" id="maf">' + lg(lng, 7) + '</a>';
					}
					tf += '<a href="javascript://" onclick="uHPB(0,this)" id="maf" class="hcmaf">' + lg(lng, 8) + '</a>';
					$('#vbg').append(tf);
					$('#vbg').show()
				}
			}
			if (!a) {
				$('#vch').show()
			}
		}
		if (hwidth < 1200) {
			mhw = 1200
		} else {
			mhw = $('#hpvdiv').width()
		}
		if ($(window).width() < mhw) {
			$('.h-ldiv,.h-rdiv').css({
				'float': 'none',
				'text-align': 'left',
				'position': 'static',
				'padding-left': '5px'
			});
			$('.hswm').hide()
		};
		$('body,table,div,tr,td,ul,li,span,a[id!=maf],p').css({
			'fontSize': mf + 'px'
		});
		$('.h-mdiv,.h-ldiv,.h-rdiv,.h-fdiv,.uhpv-l,.hswm').css('fontSize', fonts[fonts.length - 1] + 'px');
		setTimeout(function() {
			$('.admBarCenter>div').attr({
				'style': 'font-size:11px;'
			});
			if (bbg && bbg > 0) {
				$('body,table,div[id!=hpvdiv][id!=fsd][id!=vimg][id!=vbg][id!=hpvgd][id!=uhvv][id!=vch],tr,td,ul,li,span[class!=hswm],a[id!=maf],p,b').addClass('h-background-' + bbg);
				$('#puzadpn .h-background-' + bbg).removeClass('h-background-' + bbg)
			}
			if (!hwidth) {
				$('#fsd').css('padding-left', '15px');
				$('#vch').css('padding-right', '15px')
			}
		}, 1);
		if (uhe == 2) {
			$('#h-f').height($('#hpvdiv').height())
		}
		if (uhe == 3) {
			$('#hpvgd2').css('top', (($(window).height() - Number(200)) / 2) + 'px')
		}
	} else {
		$('#uhvb').show()
	}
}

function uvcl() {
	if (hgc('uha')) {
		hdc('uha');
		window.location.reload()
	} else {
		hsc('uha', 'a');
		$('#uhvb').hide();
		uhpv(has)
	}
}

function lg(c, n) {
	return lgs[c][n]
}

function uHPV(f, t) {
	hsc("uhf", f);
	$('.uhpv-a').removeClass('h-al');
	$(t).addClass('h-al');
	uhpv(has)
}

function uHPI() {
	if (hgc('hpvi')) {
		hdc('hpvi');
		$('.h-ni').removeClass('h-ni');
		$('.hvit').text(lg(lng, 2))
	} else {
		hsc('hpvi', 'v');
		$('img:visible').addClass('h-ni');
		$('.hvit').text(lg(lng, 1))
	}
}

function uHPB(n, t) {
	$('.h-ab').removeClass('h-ab');
	$(t).addClass('h-ab');
	if (hgc('hpvbg')) {
		b = hgc('hpvbg')
	} else {
		b = 0
	}
	if (n == 0) {
		hsc('hpvbg', 0);
		$('.h-background-' + b + '[id!=maf]').removeClass('h-background-' + b)
	} else {
		hsc('hpvbg', n);
		if (b) {
			$('.h-background-' + b + '[id!=maf]').removeClass('h-background-' + b)
		};
		$('body,table,div[id!=hpvdiv][id!=fsd][id!=vimg][id!=vbg][id!=vch][id!=hpvgd][id!=uhvv],tr,td,ul,li,span[class!=hswm],a[id!=maf],p,b').addClass('h-background-' + n);
		setTimeout(function() {
			$('#puzadpn .h-background-' + n).removeClass('h-background-' + n)
		}, 1)
	}
}

function hsc(name, value) {
	document.cookie = name + "=" + escape(value) + ";expires=Mon,01-Jan-2020 00:00:00 GMT;path=/"
}

function hgc(fcm) {
	var results = document.cookie.match('(^|;) ?' + fcm + '=([^;]*)(;|$)');
	if (results) {
		return (unescape(results[2]))
	} else {
		return null
	}
}

function hdc(fcm) {
	var cookie_date = new Date();
	cookie_date.setTime(cookie_date.getTime() - 1);
	document.cookie = fcm += "=;expires=" + cookie_date.toGMTString() + ";path=/"
};
$(window).resize(function() {
	uhpv(has)
});
lgs['ru'] = {
	1: 'показать',
	2: 'отключить',
	3: 'Размер шрифтов:',
	4: 'Изображения:',
	5: 'Фон:',
	6: 'Выключить',
	7: 'A',
	8: 'X'
};
lgs['en'] = {
	1: 'show',
	2: 'disable',
	3: 'Font Size:',
	4: 'Images:',
	5: 'Background:',
	6: 'Switch off',
	7: 'A',
	8: 'X'
};
lgs['ua'] = {
	1: 'показати',
	2: 'відключити',
	3: 'Розмір шрифтів:',
	4: 'Зображення:',
	5: 'Фон:',
	6: 'Вимкнути',
	7: 'A',
	8: 'X'
}

Код CSS для скрипта:

<style>
 #hpvgd,.h-mdiv,.h-mdiv2,.h-ldiv,.h-rdiv {background:#EAEAEA; color:#6D6D6D;}
 #hpvgd {width:100%; z-index:100; width:100%; border-bottom:2px solid rgb(230,230,230);}
 .h-mdiv {display:none; position:relative; margin:auto; text-alegn:center;}
 .h-mdiv2 {display:none; position:fixed; margin:auto; text-alegn:center; width:400px; height:200px;}
 .h-ldiv {float:left; padding:7px 10px 7px 0px;}
 .h-rdiv {position:absolute; top:7px; right:0px; text-align:right;}
 .h-ni {display:none !important;}
 a.hcmaf {color:red; margin-left:5px; font-size:20px; font-weight:bold;}
 a.h-anl {color:#2a72cc;}
 a.h-al {color:#ED664B;}
 .h-fi {font-weight:bold; border-radius:50%; padding:0px 8px; margin-right:5px; font-size:19px;}
 .h-background-1 {color:#fff !important; background:#000 !important;}
 .h-background-2 {color:#000 !important; background:#fff !important;}
 </style>

Есть скрипт на замену основного css стиля стилем, адаптированным под версию для слабовидящих:

<script type="text/javascript"> 
 function style_renew()
 {
 var style = document.getElementById('newStyle');
 style.href='http://hpt-kld.ru/styles/eye-ver.css';
 } 
 </script>

Вопрос: как сделать так, чтобы эти два скрипта работали в связке, а именно: по нажатию на клавишу версии для слабовидящих и последующем перемещении по сайту настройки не сбрасывались? Я пытался написать дополнительный скрипт, чтобы в случае, если я активирую первый скрипт выполнялся и второй, но т.к. плохо разбираюсь в JavaScript получился бред:

<script type="text/javascript"> 
 function css_switch(style_renew(),uvcl()){
 if (uvcl() == true)
 {
 style_renew;
 }
 }
 </script>

А вот сама кнопка:

<a href="javascript://" onclick="uvcl();css_switch()">Версия для слабовидящих</a>

Без ввода функции "css_switch" всё работало, но до первого перехода по ссылке - в таком случае стиль css сбрасывался на главный, но версия для слабовидящих оставалась функционировать. Я так понимаю, что дело в том, что мой скрипт просто не работает с куками. Но я не в состоянии написать часть скрипта для работы с куками пока что.

скрипт непонятный, переменные именованы непонятно, не понятно че код делает, ничем не могу помоч) подождем ассемблероведов)

Такие задачи нужно решать обычной сменой класса для body. Всё остальное пусть делает CSS.

Как сделать так, чтобы один javascript присоседился к другому и включался тогда, когда второй активен?