ugrás a tartalomhoz

Iframe-ben elhelyezett könyvjelzők használata a főoldalon...

GtNM · 2012. Már. 16. (P), 12.17
Van egy főoldal, amiben található egy iframe. A főoldalon helyeztem el linkeket és azt szeretném megoldani,hogy a linkekre kattintva ugorjon az iframe-n belül megjelölt könyvjelzőkhöz. IE-ben nincs is baj, működik,de a többi böngészőben ez a fgv. megbukott, várnám a megoldásokat, ötleteket,hogy merre tovább???

Ut: Egy bizonyos területen kattintásra, más-és más szöveget szeretnék megjeleníteni, és azért választottam ezt,mert úgy véltem ez a legegyszerűbb megoldás,de ha vkinek van másmilyen ötlete írja le kérem, hátha az jobb. Div-ek display állításával megtudom valósítani,de 20-30 szöveges területet nem akarok elhelyezni, ezért is ink. egy dokumentumon belüli megjelenítést akarok választani.

Törzs:
<html>
<head>
<meta http-equiv="Content-Language" content="hu">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<script>

function valami1(){
reszletek.document.getElementById("valami1").focus();
}
function valami2(){
reszletek.document.getElementById("valami2").focus();
}
function valami3(){
reszletek.document.getElementById("valami3").focus();
}
function valami4(){
reszletek.document.getElementById("valami4").focus();
}
function valami5(){
reszletek.document.getElementById("valami5").focus();
}
function valami6(){
reszletek.document.getElementById("valami6").focus();
}
</script>
</head>

<body>
<iframe title="Részletek" scrolling="no" class="reszletek" id="reszletek" type="text/html" width="600" height="50" src="reszlet.htm" frameborder="0"></iframe>
<p><a href="" onclick="valami1()">Valami1</a></p>
<p><a href="" onclick="valami2()">Valami2</a></p>
<p><a href="" onclick="valami3()">Valami3</a></p>
<p><a href="" onclick="valami4()">Valami4</a></p>
<p><a href="" onclick="valami5()">Valami5</a></p>
<p><a href="" onclick="valami6()">Valami6</a></p>
</body>

</html>


Iframe:
<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<style>
body
{
width:600px;
background-color:#000000;
color:#ffffff;
margin: 0px 0px 0px 0px;
}
.reszlet_szoveg
{color:#fffff;
width:600px;
height:50px;
}
</style>
</head>

<body>
<div id="valami1" class="reszlet_szoveg">
<a name="Valami1">Valami1</a>, amit írhatunk vmihez, lássuk csak:
pl. Cím: Rész, évad stb.
</div>
<div id="valami2" class="reszlet_szoveg">
<a name="Valami2">Valami2</a>, amit írhatunk vmihez, lássuk csak:
pl. Cím: Rész, évad stb.
</div>
<div id="valami3" class="reszlet_szoveg">
<a name="Valami3">Valami3</a>, amit írhatunk vmihez, lássuk csak:
pl. Cím: Rész, évad stb.
</div>
<div id="valami4" class="reszlet_szoveg">
<a name="Valami4">Valami4</a>, amit írhatunk vmihez, lássuk csak:
pl. Cím: Rész, évad stb.
</div>
<div id="Valami5" class="reszlet_szoveg">
<a name="Valami5">Valami5</a>, amit írhatunk vmihez, lássuk csak:
pl. Cím: Rész, évad stb.
</div>
<div id="valami6" class="reszlet_szoveg">
<a name="Valami6">Valami6</a>, amit írhatunk vmihez, lássuk csak:
pl. Cím: Rész, évad stb.
</div>
</body>

</html>
‹ Különálló JS fájl és php közti kapcsolat, változóátadás Form újratöltése ›
 ■
1

A focus() normális esetben

kuka · 2012. Már. 16. (P), 12.47
  • A focus() normális esetben csak interaktív elemekre működhet. Használj helyette inkább scrollIntoView()-t.
  • reszletek változó nem létezik. Csak mert egy elemnek ez az id-je, attól még nem kell létrejöjjön globális változó.
  • Azok a hivatkozások mindig újratöltik a külső dokumentumot, innentől már a böngésző szeszélyére van bízva, hogy a korábban elgörgetett belső dokumentum megtartja-e a pozícióját.
Légy szíves használj BBCode forráskód színezést és DOCTYPE-ot.

Ami a személyes ízlésemet illeti, én teljesen kihagynám az iframe és JavaScript részeket:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1250">
<style>
.gorgetheto {
  width:600px;
  height:50px;
  overflow:hidden;
  background-color:#000000;
  color:#ffffff;
  margin: 0px;
}
.reszlet_szoveg {
  height:50px;
}
</style>
</head>
<body>
<div class="gorgetheto">
<div id="valami1" class="reszlet_szoveg">
Valami1, amit írhatunk vmihez, lássuk csak: pl. Cím: Rész, évad stb.
</div>
<div id="valami2" class="reszlet_szoveg">
Valami2, amit írhatunk vmihez, lássuk csak: pl. Cím: Rész, évad stb.
</div>
<div id="valami3" class="reszlet_szoveg">
Valami3, amit írhatunk vmihez, lássuk csak: pl. Cím: Rész, évad stb.
</div>
<div id="valami4" class="reszlet_szoveg">
Valami4, amit írhatunk vmihez, lássuk csak: pl. Cím: Rész, évad stb.
</div>
<div id="valami5" class="reszlet_szoveg">
Valami5, amit írhatunk vmihez, lássuk csak: pl. Cím: Rész, évad stb.
</div>
<div id="valami6" class="reszlet_szoveg">
Valami6, amit írhatunk vmihez, lássuk csak: pl. Cím: Rész, évad stb.
</div>
</div>
<p><a href="#valami1">Valami1</a></p>
<p><a href="#valami2">Valami2</a></p>
<p><a href="#valami3">Valami3</a></p>
<p><a href="#valami4">Valami4</a></p>
<p><a href="#valami5">Valami5</a></p>
<p><a href="#valami6">Valami6</a></p>
</body>
</html>
2

document

Poetro · 2012. Már. 16. (P), 13.21
A document elérése máshogy működik IE esetén, mint a többi böngészőben. És jobb, ha nem az IE modellt tanulod meg, mert már rég kisebbségben van, valamint nem is szabványos.
var document = iframe.contentDocument ? iframe.contentDocument : iframe.contentWindow.document;