Помогите пожалуйста оптимизировать скрипт
Вот скрипт, который меняет ширину блока.
Есть две ссылки, которые выполняют по клику функции reduceBlock() и increaseBlock(). По нажатии на первую, ширина блока увеличивается и сама ссылка скрывается, открывая вторую, которая работает наоборот. Как можно сократить этот код?
function reduceBlock(){
document.getElementById('edittemplate').style.width = '1150px';
document.getElementById('resize').style.width = '1150px';
document.getElementById('reduce').style.display = "none";
document.getElementById('increase').style.display = "inline";
}
function increaseBlock(){
document.getElementById('edittemplate').style.width = '850px';
document.getElementById('resize').style.width = '850px';
document.getElementById('reduce').style.display = "inline";
document.getElementById('increase').style.display = "none";
}
|
function reduceBlock(a,b,c,d){
document.getElementById('edittemplate').style.width = a;
document.getElementById('resize').style.width =b';
document.getElementById('reduce').style.display = c;
document.getElementById('increase').style.display = d;
}
reduceBlock("1150px","1150px", "none","inline");
//Эту строку запускаем при свертывании
reduceBlock("850px","850px","inline", "none");
|
Спасибо!
|
function reduceBlock(ShowHid){
function b(id) {
return document.getElementById(id).style;
}
var a='850px,850px,inline,none'.split(',');
if(ShowHid)ar='1150px,1150px,none,inline'.split(',');
b('edittemplate').width = a[0];
b('resize').width =a[1];
b('reduce').display= a[2];
b('increase').display = a[3];
}
reduceBlock(1);//Разворачиваем;
reduceBlock(0);//Cворачиваем;
:) Число символов Пост 2 = 387 Пост 3 = 375 Пост 4 = 376 Дзен Выигрывает! |
Цитата:
|
<!--СЧЁТЧИК СИМВОЛОВ-->
<script type="text/javascript" src="http://yandex.st/jquery/1.4.4/jquery.min.js"></script>
<textarea id="reply" oninput="tstLen()" rows=7 cols="50"></textarea>
<script>var a,L,epl=$("#reply"),str='<small id="plng" style="border:1px solid;padding:2px 3px;">Написано символов: <b>00</b> </small><br>';epl.before(str);function epl3(){a=epl.val().length;if(a>9){L=''}else{L='0'};$("#plng b").text(L+a)};epl3();$(".pl-quote").click(function (){setTimeout('epl3()',100)});epl.bind('mouseout mousemove keydown keypress keyup',function(e){epl3()});</script>
Цитата:
:( ....(Лан, я тоже баиньки... Сноф! |
Цитата:
|
я тут тоже решил поиграть с вами, 235 с вызовом)))
function reduceBlock(c,d){for(var b=["edittemplate","resize","reduce","increase"],a=b.length;;a--)document.getElementById(b[a]).style[c[a]]=d[a]};
reduceBlock(["width","width","display","display"],["1150px","1150px","none","inline"]);
(код не проверял, но работать должен) |
:) Ну спасибо всем!
|
Цитата:
:( Обман - нет запуска второй функции |
cyber,
317 с двумя запусками ... Вариант Цитата:
<!DOCTYPE HTML>
<html>
<head>
<title></title>
<style type="text/css">
div{
background-color: #FFFF00;
}
</style>
</head>
<body>
<div id = 'edittemplate' >
1234567890 id = 'edittemplate'
</div>
<div id = 'resize' >
1234567890 id = 'resize'
</div>
<div id = 'reduce' >
1234567890 id = 'reduce'
</div>
<div id = 'increase' >
1234567890 id = 'increase'
</div>
<script language="JavaScript" type="text/javascript">
//function reduceBlock(b){var c=["850px","inline","850px","none"];b&&(c=["1150px","none","1150px","inline"]);b=["edittemplate","reduce","resize","increase"];for(var d=["width","display"],a=0;a<b.length;a++)document.getElementById(b[a]).style[d[a%2]]=c[a]}reduceBlock(1);reduceBlock(0);
function reduceBlock(b) {
var c = ["850px", "inline", "850px", "none"];
b && (c = ["1150px", "none", "1150px", "inline"]);
b = ["edittemplate", "reduce", "resize", "increase"];
for (var d = ["width", "display"], a = 0; a < b.length; a++)
document.getElementById(b[a]).style[d[a % 2]] = c[a]
}
reduceBlock(1);
reduceBlock(0);
</script>
<br />
<input type="button" name="" value="1" onclick="reduceBlock(1)"/>
<input type="button" name="" value="0" onclick="reduceBlock(0)"/>
</body>
</html>
|
:thanks: Рони памятник за настойчивость и дотошность...(плюсы кончились
|
всю веселуху пропустил :(
251 вместе с двумя вызовами функций
function reduceBlock(a,i){
while(i--) document.getElementById(["edittemplate","resize","reduce","increase"][i]).style[i<2?"width":"display"]=a[i];
}
reduceBlock(["1150px","1150px","none","inline"],4);
reduceBlock(["850px","850px","inline","none"],4);
|
function reduceBlock(a){
var i=4;while(i--) document.getElementById(["edittemplate","resize","reduce","increase"][i]).style[i<2?"width":"display"]=a.split('|')[i];
}
reduceBlock("1150px|1150px|none|inline");
reduceBlock("850px|850px|inline|none");
Приукрасил .... 247 |
Дзен-трансгуманист,
:blink: |
Как альтернатива:
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title> test </title>
<link rel="stylesheet" type="text/css" href="base.css"/>
<link rel="stylesheet" type="text/css" href="style0.css" title="0"/>
<link rel="stylesheet" type="text/css" href="style1.css" title="1"/>
</head>
<body>
<script>
function setStyle(s) {
for(i=0; (a=document.getElementsByTagName("link")[i]); i++) {
if(a.getAttribute("title")) {
a.disabled=true;
if(a.getAttribute("title")==s) a.disabled=false;
}
}
}
//setStyle(0);
//setStyle(1);
</script>
<input type="button" name="" value="0" onclick="setStyle(0)"/>
<input type="button" name="" value="1" onclick="setStyle(1)"/>
</body>
</html>
|
| Часовой пояс GMT +3, время: 00:06. |