输入按钮来调整形状

嗨，有人可以帮助我获得按钮来调整形状。我已经自己去了，但无法让它工作。下面是我的代码必须事先到目前为止感谢输入按钮来调整形状

<html> 
<head> 
<script> 


function Smaller() 
{ 
document.getElementById("rectangle1").height="50"; 
document.getElementById("rectangle1").width="50"; 
} 



function resetsize() 
{ 
document.getElementById("rectangle1").height="200"; 
document.getElementById("rectangle1").width="300"; 
} 



</script> 
</head> 
<body> 

<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="width: 500px; height: 500px"> 
    <rect id="rectangle1" x="150" y="0" width="300" height="200" /> 
</svg> 


    <input type="button" onclick="Smaller" value="Smaller" /> 
    <input type="button" onclick="resetsize" value="ResetSize" /> 

</body> 
</html>

来源

2012-04-13 Len

你尝试我所提供的代码。有用！ – 2012-04-13 12:59:01

<html> 
<head> 
<script> 

function smaller() { 
    document.getElementById("rectangle1").style.height="50px"; 
    document.getElementById("rectangle1").style.width="50px"; 
} 

function resetsize() { 
    document.getElementById("rectangle1").style.height="200px"; 
    document.getElementById("rectangle1").style.width="300px"; 
} 



</script> 
</head> 
<body> 

<div style="min-height:500px"> 
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" style="width: 500px; height: 500px" id="rectangle1"> 
    <rect x="150" y="0" width="300" height="200" /> 
</svg> 
</div> 


    <input type="button" onclick="smaller()" value="smaller" /> 
    <input type="button" onclick="resetsize()" value="ResetSize" /> 

</body> 
</html>

请看按钮的点击上的属性格式。并且没有你的svg元素的id。： - ）

来源

2012-04-13 12:31:47

感谢您的帮助，有没有一种方法可以在形状调整大小时不使按钮移动，或者我必须使用按钮的x和y坐标来防止这种情况发生？ – Len 2012-04-13 13:05:45

@Len我更改的代码如何？只需将矩形包裹在一个div中并给它一个最小高度。希望有所帮助！ – 2012-04-13 13:13:58

是的代码作品感谢您的帮助:) – Len 2012-04-13 13:40:25

您可以用style属性访问DOM元素的CSS属性，像这样：

function smaller() { 
    document.getElementById("rectangle1").style.height="50"; 
    document.getElementById("rectangle1").style.width="50"; 
} 

function resetsize() { 
    document.getElementById("rectangle1").style.height="200"; 
    document.getElementById("rectangle1").style.width="300"; 
}

的几个注意事项您的编码约定：您通常希望在功能的名称相同的行上打开功能括号。函数名称应始终为camelCase;仅为类名保存UpperCase。最后，确保你在函数内部添加了一些东西，if语句等。你的开发人员会感谢你。 =）

编辑：确保你的HTML看起来像这样：

<input type="button" onclick="smaller()" value="Smaller" /> 
<input type="button" onclick="resetsize()" value="ResetSize" />

来源

2012-04-13 12:29:21

我尝试过和没有风格属性，它仍然没有工作 – Len 2012-04-13 12:50:18

@Len：看到我编辑的答案。 – 2012-04-13 13:13:46

-2

使用jQuery来避免这种DOM可憎的document.getElementById（ “fooo”）

来源

2012-04-13 12:51:57

输入按钮来调整形状

回答

相关问题