Interne link op pagina in div - Softwareontwikkeling

maandag 14 april 2008 21:19

Acties:

Topicstarter

Ik laad met behulp van Javascript mijn content in een div, waar er overflow opzit. Wanneer ik nu klik op een interne link op een pagina die in de div geladen is, wil ik hebben dat de scrollbar van mijn div naar het juiste punt springt. Nu verplaatst hij enkel de scrollbar van de hoofdpagina. Is dit mogelijk?

maandag 14 april 2008 21:23

Acties:

Noork

Volgens mij werkt dit gewoonweg niet wanneer je zoiets in een div met scrollbar hebt staan.

En ik neem aan dat je een anchor (a#ilinkje) tag bedoelt?

dinsdag 15 april 2008 13:19

Acties:

F e r o x

Topicstarter

Inderdaad een verwijzing naar een bepaalde div, met a#-link. Spijtig dat het niet mogelijk is, zal iets anders moeten bedenken dan.

dinsdag 15 april 2008 13:25

Acties:

BtM909

Watch out Guys...

Tuurlijk is dat mogelijk, alleen met een klein beetje scripting

Heb je al gekeken naar diverse JS mogelijkheden?

Ace of Base vs Charli XCX - All That She Boom Claps (RMT) | Clean Bandit vs Galantis - I'd Rather Be You (RMT)
You've moved up on my notch-list. You have 1 notch
I have a black belt in Kung Flu.

dinsdag 15 april 2008 18:24

Acties:

F e r o x

Topicstarter

BtM909 schreef op dinsdag 15 april 2008 @ 13:25:
Tuurlijk is dat mogelijk, alleen met een klein beetje scripting

Heb je al gekeken naar diverse JS mogelijkheden?

Nog niet, zal eens op zoek gaan. Heb je zelf een nuttig adres, die ik kan gebruiken?

dinsdag 15 april 2008 19:47

Acties:

Bozozo

Your ad here?

Je zou elk item in een div kunnen stoppen. Bij een klik op een link tel je de offsetHeight van alle bovenliggende divs in als scrollTop van de container.

TabCinema : NiftySplit

dinsdag 15 april 2008 19:48

Acties:

Noork

Kun je geen voorbeeld laten zien?

Ik vind met Google genoeg voorbeelden van werkende scroll-divjes met anchors. Zie b.v. http://vflayouts.com/scrollboxes.php#likes

dinsdag 15 april 2008 19:55

Acties:

F e r o x

Topicstarter

Heb niet direct een voorbeeld, aangezien ik nog volop bezig ben aan de site. Maar wanneer ik die anchor-punten in jouw voorbeeld gebruik, dan scrollt hij de main-pagina, en niet de inhoud in de div (overflow-vertical ligt aan).

dinsdag 15 april 2008 22:10

Acties:

Bozozo

Your ad here?

Dan doe je toch echt iets niet goed. Dit werkt gewoon:

HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
    <title>Test</title>
    <meta http-equiv="content-type" content="text/html;charset=utf-8" />
    <meta http-equiv="Content-Style-Type" content="text/css" />
    
    <style type="text/css">
    #container {
        border: 1px solid black;
        width: 200px;
        height: 200px;
        overflow: auto;
    }
    .itembox {
        height: 200px;
    }
    </style>
</head>

<body>
    <a href="#item1">Item 1</a>
    <a href="#item2">Item 2</a>
    <a href="#item3">Item 3</a>
    <a href="#item4">Item 4</a>
    <a href="#item5">Item 5</a>
    
    <div id="container">
        <div class="itembox" id="item1">
            This is item 1!
        </div>
        <div class="itembox" id="item2">
            This is item 2!
        </div>
        <div class="itembox" id="item3">
            This is item 3!
        </div>
        <div class="itembox" id="item4">
            This is item 4!
        </div>
        <div class="itembox" id="item5">
            This is item 5!
        </div>
    </div>
</body>
</html>

TabCinema : NiftySplit

zondag 20 april 2008 18:43

Acties:

F e r o x

Topicstarter

Heb met scrollTop gewerkt, en zo is het perfect gelukt. Heb nog een andere javascript-probleempje, maar het is misschien overzichtelijker als ik daar een ander topic over open.

Bedankt voor de tips hier!