1 2 3 4 оголемяване

[diva4et0o0]

Как да направя примерно числата 1 2 3 4 и когато си сложиш мишката на 1 2 3 или 4 над тях или под тях да се по явя ва съсщото число самоче оголемено

примерно:
1

1 2 3 4
/\
|

 

[Anonymous]

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
body { font-size: 12px; }
#response { font-size: 26px; }
</style>
<script type="text/javascript">
function maximize(number) {
document.getElementById('response').innerHTML = number;
}
</script>
</head>
<body>
<a href="#" onMouseover="maximize(this.innerHTML);">1</a>  
<a href="#" onMouseover="maximize(this.innerHTML);">2</a>  
<a href="#" onMouseover="maximize(this.innerHTML);">3</a>  
<a href="#" onMouseover="maximize(this.innerHTML);">4</a> <br /> <hr>
<div id="response"></div>

Нещо такова ли ?

 

[diva4et0o0]

Да а сега как да го направя примерно са на едно и да им се появи картинка
смисал да не се оголямя ва ми дасе смяня с картинка

 

[emagi]

Ето ти един код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>Untitled Document</title>
<style type="text/css">
#small {
width:100px;
height:30px;
}
span {
cursorointer;
}
</style>
<script type="text/javascript">
function changeSize(num){
var chislo = document.getElementById(num);
document.getElementById('small').innerHTML = "<img src='"+chislo.innerHTML+".png' alt='pic' border='0' />";
}
</script>
</head>

<body>
<div id="small"></div>
<span id="nomer1" onmouseover="changeSize(this.id);">1</span>
<span id="nomer2" onmouseover="changeSize(this.id);">2</span>
<span id="nomer3" onmouseover="changeSize(this.id);">3</span>
<span id="nomer4" onmouseover="changeSize(this.id);">4</span>
<span id="nomer5" onmouseover="changeSize(this.id);">5</span>
</body>
</html>

Като си направиш снимки,които съответно се казват 1.png, 2.png, 3.png, 4.png, 5.png, и те трябва да са в една папка с този файла

 

[diva4et0o0]

Много е гадно така така 1 2 3 4 и излизат върху картинката

 

[Anonymous]

Или може да заместиш JS функцията със един switch() , като само си оправиш имената на картинките.

function maximize(number) {
var divid = document.getElementById('response');
switch (number) {
case '1' : divid.innerHTML = '<img src=\'images/картинка1.png\' />'; break;
case '2' : divid.innerHTML = '<img src=\'images/картинка2.png\' />'; break;
case '3' : divid.innerHTML = '<img src=\'images/картинка3.png\' />'; break;
case '4' : divid.innerHTML = '<img src=\'images/картинка4.png\' />'; break;
default : divid.innerHTML = '';
}
}

 

[emagi]

Много е гадно така така 1 2 3 4 и излизат върху картинката

При моя вариант няма как да излязят числата върху картинката

 

[diva4et0o0]

Или може да заместиш JS функцията със един switch() , като само си оправиш имената на картинките.

function maximize(number) {
var divid = document.getElementById('response');
switch (number) {
case '1' : divid.innerHTML = '<img src=\'images/картинка1.png\' />'; break;
case '2' : divid.innerHTML = '<img src=\'images/картинка2.png\' />'; break;
case '3' : divid.innerHTML = '<img src=\'images/картинка3.png\' />'; break;
case '4' : divid.innerHTML = '<img src=\'images/картинка4.png\' />'; break;
default : divid.innerHTML = '';
}
}

Стана мерси