V minulosti fórum o online-chatu, nyní již takový obecný pokec
a nezařazené témy
Moderátoři: Moderátoři, GunShop.cz
-
Warthog
- Příspěvky: 1638
- Registrován: 20 bře 2010 23:59
- Bydliště: Rijnland (NL), Sudetenland (CZ)
Příspěvek
od Warthog » 15 led 2012 13:54
u IMG nastavíš velikost na 100 % a obalíš to DIVem nějak takhle:
Kód: Vybrat vše
<div id = "obrazek">
<img src = "obrazek.jpg" width = "100%">
</div>
Zbytek je stejný - nastavíš velikost objektu s id "obrazek", což teď nebude IMG ale DIV a obrázek se přizpůsobí.
Laßt uns fest zusammenhalten - In der Eintracht liegt die Macht - Mit vereinter Kräfte Walten - Wird das Schwere leicht vollbracht
-
pussylala
- Příspěvky: 1429
- Registrován: 31 srp 2007 23:54
- Bydliště: Praha 5
-
Kontaktovat uživatele:
Příspěvek
od pussylala » 15 led 2012 14:49
Kam pak vložím onload = resize() aby to fungovalo? Fakt jsem v tom začátečník a hodně s tím bojuji. Díky
-
Warthog
- Příspěvky: 1638
- Registrován: 20 bře 2010 23:59
- Bydliště: Rijnland (NL), Sudetenland (CZ)
Příspěvek
od Warthog » 15 led 2012 16:08
Ups, mea maxima culpa - nech to u toho obrázku, jako v původním příkladu. Když jsem psal ten druhý, tak mi to vypadlo.
Laßt uns fest zusammenhalten - In der Eintracht liegt die Macht - Mit vereinter Kräfte Walten - Wird das Schwere leicht vollbracht
-
pussylala
- Příspěvky: 1429
- Registrován: 31 srp 2007 23:54
- Bydliště: Praha 5
-
Kontaktovat uživatele:
Příspěvek
od pussylala » 15 led 2012 16:59
Ok klidně to tak nechám. Jenom malá drobnost. Ten šmejd od Microsoftu to nepřelouská. Takže na IE to nefunguje. Já osobně používám firefox, ale musím to mít funkční i na IE. Poradíš? Díky
-
Warthog
- Příspěvky: 1638
- Registrován: 20 bře 2010 23:59
- Bydliště: Rijnland (NL), Sudetenland (CZ)
Příspěvek
od Warthog » 15 led 2012 17:19
Večer na to kouknu, měl jsem za to, že IE7 a novější už zvládají tyhle věci rozumně.
Laßt uns fest zusammenhalten - In der Eintracht liegt die Macht - Mit vereinter Kräfte Walten - Wird das Schwere leicht vollbracht
-
pussylala
- Příspěvky: 1429
- Registrován: 31 srp 2007 23:54
- Bydliště: Praha 5
-
Kontaktovat uživatele:
Příspěvek
od pussylala » 15 led 2012 17:34
V téhle variantě to IE nepobere
Kód: Vybrat vše
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<title>Nová stránka 1</title>
</head>
<body>
<script language="JavaScript">
function resize(){
var image = document.getElementById('obrazek');
var imageWidth = image.width;
var containerWidth = window.innerWidth;
if ( imageWidth > containerWidth){
document.getElementById('obrazek').width = containerWidth * 0.5;
}
}
</script>
<img id = "obrazek" src = "obrazek.jpg" onload = resize()>
</body>
</html>
díky
-
Warthog
- Příspěvky: 1638
- Registrován: 20 bře 2010 23:59
- Bydliště: Rijnland (NL), Sudetenland (CZ)
Příspěvek
od Warthog » 20 led 2012 08:47
Tak tady to máš.
Kód: Vybrat vše
<!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>
<title></title>
<style type="text/css">
.container {
border:1px solid red;
width: 400px;
margin-bottom: 1em;
text-align:center;
padding-bottom:1em;
}
</style>
<script type="text/javascript" language="javascript">
function resizeAll() {
resize('obrazekVelky', 'containerVelky');
resize('obrazekMaly', 'containerMaly')
}
function resize(idObrazek, idContainer){
var image = document.getElementById(idObrazek);
var imageWidth = image.width;
var containerWidth = document.getElementById(idContainer).offsetWidth;
if ( imageWidth > containerWidth){
image.width = containerWidth * 0.9;
}
}
</script>
</head>
<body onload="resizeAll()">
<div class="container" id="containerVelky">
Velký: <br />
<img id="obrazekVelky" src="http://www.cooperativeindividualism.org/library-books.jpg">
</div>
<div class="container" id="containerMaly">
Malý: <br />
<img id="obrazekMaly" src="http://www.marketresearchworld.net/images/stories/icon_library.gif">
</div>
</body>
</html>
Laßt uns fest zusammenhalten - In der Eintracht liegt die Macht - Mit vereinter Kräfte Walten - Wird das Schwere leicht vollbracht
-
pussylala
- Příspěvky: 1429
- Registrován: 31 srp 2007 23:54
- Bydliště: Praha 5
-
Kontaktovat uživatele:
Příspěvek
od pussylala » 03 úno 2012 16:07
Ještě jsem ti nepoděkoval, takže díky moc, moc! Všechno funguje, šlape. Trochu jsem musel script upravit a teď už je to 100%. Tady jsem přidal ještě jednu hodnotu.
function resize(idObrazek, idContainer){
var image = document.getElementById(idObrazek);
var imageWidth = image.width;
var containerWidth = document.getElementById(idContainer).offsetWidth;
if ( imageWidth > containerWidth * 0.6){
image.width = containerWidth * 0.6;
Mám ale ještě (doufám) poslední otázku. Jak by tenhle script vypadal, kdyby jsme místo šířky obrázku dali výšku obrázku? Různě jsem to zkoušel přepisovat, ale nic mi nefungovalo. Díky
-
Warthog
- Příspěvky: 1638
- Registrován: 20 bře 2010 23:59
- Bydliště: Rijnland (NL), Sudetenland (CZ)
Příspěvek
od Warthog » 03 úno 2012 18:08
Možná ne úplně chápu otázku, ale místo atributu width jde použít height a bude to chodit taky. Samozřejmě úplně nejčistší by byla složitější logika, která by hlídala obojí najednou, včetně situací, kdy obrázek je větší v obou rozměrech o hodně apod. Záleží na tom, jak moc si s tím chceš hrát.
Laßt uns fest zusammenhalten - In der Eintracht liegt die Macht - Mit vereinter Kräfte Walten - Wird das Schwere leicht vollbracht
-
pussylala
- Příspěvky: 1429
- Registrován: 31 srp 2007 23:54
- Bydliště: Praha 5
-
Kontaktovat uživatele:
Příspěvek
od pussylala » 03 úno 2012 19:55
No pravě. Když všechno přepíšu na "height" tak to nefunguje a nevím proč. Mě to taky hned napadlo přepsat, ale nejde to. Jinak všechno ostatní funguje, už složitější to nechci
Bohatě mi to takhle vyhovuje, jenom místo "width" by bylo lepší "height"
-
pussylala
- Příspěvky: 1429
- Registrován: 31 srp 2007 23:54
- Bydliště: Praha 5
-
Kontaktovat uživatele:
Příspěvek
od pussylala » 09 úno 2012 02:15
Tak nakonec jsem použil původní kód, co jsi mi poslal, ale místo příkazu
window.innerHeight, který IE nepodporuje, jsem použil
document.documentElement.clientHeight. Samozřejmě všechno jsem pozměnil na Height. Díky za vše. Doufám, že tímhle jsem kapitolu "resize" ukončil
Kód: Vybrat vše
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
</head>
<body>
<script language="JavaScript">
function resize(){
var image = document.getElementById('obrazek');
var imageHeight = image.height;
var containerHeight = window.innerHeight;
if ( imageHeight > containerHeight){
document.getElementById('obrazek').height = containerHeight * 0.5;
}
}
</script>
<img id = "obrazek" src = "obrazek.jpg" onload = resize()>
</body>
</html>