Autor Zpráva
Tygr36
Profil
Zdravím,
Získáním a upravením zdrojového kodu jedhnoho webu jsem si vytvořil online kroniku obce avšak ať už sem se snažil hledat jak se dalo nikde sem nenašel nějaký návod nebo kod na vytvoření nějakého navigačního menu nebo posunující lišty která by mě umožnila přejít například hned na 250 stránku.

na turnjs.com jsem našel jakousi navigační lištu která by byla fajn avšak ze zdrojového kodu jsem ji nedokázal získat a návod na nic jsem na stránce nějak nenašel.

Máte někdo nějaký nápad nebo znáte něco ?

Díky za odpovědi.
Petr ZZZ
Profil
Na 250. stránku můžeš napsat odkaz jako na kteroukoli jinou stránku:
<a href="strana250.html">dvěstěpadesátá stránka</a>

Příklady kódů různých menu včetně CSS najdeš třeba na této stránce.
tygr36
Profil *
Ano to mě napadlo ale nevím si rady s adresou té stránky protože když listuji tak pořád url zůstava stejné.
Petr ZZZ
Profil
Že url je pořád stejné, to by mohlo být způsobeno zápisem v souboru .htaccess. Jestli se v něm nechceš hrabat, najeď myší někde na odkaz, který vede na tu stránku, zmáčkni pravé myšítko a vyber z nabídky něco jako "zkopírovat odkaz". Nebo na ten odkaz jen najeď myší a podívej se, co se ti objeví na spodním okraji obrazovky – měla by tam být vidět adresa toho odkazu.

(Furt stejná adresa je mimochodem velkou chybou z hlediska SEO, protože má nepříznivý vliv na generování přirozených odkazů.)
Mike8748
Profil
Tygr36:
viz. http://turnjs.com/docs/Method:_page

dalo by se to v javascriptu zkombinovat s tim že pokud v adrese bude např. #page123, tak by se zavolala daná metoda a přesune te na danou stránku.
Tygr36
Profil
pro Petr ZZZ: bohužel když najedu na roh stránky (po kliknutí se otočí) žádný odkaz nevidím a ani když kliknu pravým nemám s odkazem nic na výběr. Prostě se to nechová jako odkaz.
pro Mike8748: tuto stránku sem při svém pátrání také našel ale bohužel nejsem moc schopný a nějak to nemužu zkombinovat nemohl by si to zkusit ?

zatím moc díky kluci.
Petr ZZZ
Profil
Reaguji na Tygra36:
V úvodním příspěvku odkázaná stránka obce se mi dvě minuty nechtěla načíst, pak jsem to vzdal. Možná by stálo za úvahu seznámit se se základy HTML a CSS a až potom hledat inspiraci v kódech na jiných stránkách. Obávám se, že bez nějakých minimálních znalostí bude upravování cizích kódů velmi náročné a nezáživné.
Rellik
Profil
Petr ZZZ:
Tak tak, kronika obce http://projekt36.wz.cz/kronikant/knihant.htm dokonce tak zatíží PC, že tuto stránku nelze nějaký čas ani zavřít. A to nemluvím ani o tom, že se to v mém případě načítá přesně 1 minutu a to mám připojení 22Mb/s. Nakonec se to sice načte, ale je tam jen červená obálka knížky se kterou nejde nic dělat. Takže je to víceméně nepoužitelné a tím pádem k ničemu.
Mike8748
Profil
když se ukáže červená první stránka tak za pravej horní roh se dá otáčet stránky

načítá se to dlouho protože je tam hodně obrázků, asi 380, každej má kolem 250kb...

v kódu

<div id="page11" class="page">
                <div class="img11">
                    <span class="pageNum right">11 // 380</span>
                    <img src="http://projekt36.wz.cz/kronikant/011.jpg"  />
                </div>
            </div>
pro každou stránku, pomocí JS se akorát přepíná který DIV je zobrazen

použitelné by to bylo kdyby to nemělo tolik stránek, nebo stránky byly načítány ajaxem
(a samozdřejmě hostováno někde jinde než na sdíleném hostingu WZ)
Petr ZZZ
Profil
Mike8748:
„načítá se to dlouho protože je tam hodně obrázků, asi 380, každej má kolem 250kb...“
Tak to je mazec. To je tak sto- až třistanásobek objemu dat, který bych na jedné stránce viděl jako únosný.

Tygr36:
Jestli je podobně „řešen“ i web, na kterém jsi se inspiroval, naléhavě doporučuji inspirovat se kdekoli jinde.
Rellik
Profil
Mike8748:
když se ukáže červená první stránka tak za pravej horní roh se dá otáčet stránky
To je sice pěkné, ale jak to má obyčejný uživatel vědět? Já vyzkoušel několik možností - poklep, kolečko, pravé tl, drž a potáhni a když nic nefungovalo, označil sem to za nefunkční a zavřel stránku. Jinak cca 97Mb jedna stránka?! No potěš... Chce to celé předělat a stránky načítat až když jsou potřeba a ne je nechat natahovat naráz a v mezičase jít na kafe. Zkus to celé překopat. Kroniku dej do PDF a to pak zobrazovat. Já sem nedávno řešil něco podobného Není to sice optimální, ale pro svůj účel postačuje... ;)
Tygr36
Profil
Všem díky, máte pravdu je to dost velký ale prostě nic použitelnýho sem nenašel a jelikož znám fakt jen základy nemám nic jinýho čím bych to nahradil.

Rellik:
samozřejmě později sem měl v plánu dát uvodní větu npř. jak otáčet stránky atd. ale ta byla zbytečná dokud se pokouším udělat s tím něco dál. Dívám se na tvoji tvorbu a asi každá druha stranka se mi nenačte a musím dát několikrát f5 aby se načetla. Nevím čím to je a rozhodně to nevypadá tak efektně.

Pokud by jste měl někdo nějaký nápad na kroniku o 380 stránkách ve stylu jako je první můj odkaz a fungoval by líp rád ho uvítám.
user243
Profil
lol... efektně...;
Vám asi určitě nevadí reklama mezi mezi oblíbeným filmem/seriálem, možná se na ni díváte i rád; zkuste tu stránku poslal své manželce/přítelkyni/známe, co Vám odpoví;
snižte velikost obrázků, co to jen půjde a tak, aby to zůstalo čitelné;
jestli nechcete/neovládáte php, tak si vytvořte samostatné html stránky, kde bude jen dvojlist (dva obrázky), odkaz na následující a minulou stránku, někde uvedeno, na které straně se právě nacházím a možnost přejít na jakoukoliv stranu bez zdlouhavého listování;
pro rychlejší zobrazení stran můžete použít preload;
a můžete si s tím vyhrát i tak, že ten ohnutý roh stránky budete mít jako obrázek, který se zobrazí/zmizí, pokud se bude v nějaké oblasti vyskytovat kurzor;
mohl by tam být i nějaký odkaz na zavření kroniky a přejití na úvodní stránku, kde je ta červená knížka bez textu;
zkusit používat title k odkazům, aby to nebylo tak moc intuitivní;

nezlobte se, ale mě to efektně jen otrávilo;
Petr ZZZ
Profil
Reaguji na Tygra36:

Tu v [#1] odkázanou stránku jsem neviděl, ale podle toho, co zde čtu, to otáčení stránek asi bude udělané JavaScriptem; to je vyšší dívčí, nejdřív se seznam se základy HTML a CSS (není to až zas tak těžké).

Aby to nebylo tak velké, musíš každou jednotlivou stránku kroniky uložit jako jednotlivou stránku html. Zkus to takhle; vytvoř si někde na disku složku oskeruse a ulož si do ní následujících pět souborů. Až to budeš mít, podívej se, jak to funguje (otevři si některý z těch souborů v prohlížeči, klikej si a dívej se na zdrojové kódy jednotlivých stránek). Potom se zajímej o CSS.

1. Tento text ulož jako soubor index.html v kódování utf-8
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8">
        <title>Obsah webu o oskeruši</title>
        <meta name="description" content="Tento web se věnuje oskeruším.">
        <style>
            body, p, ul, li { color:#550000; background-color:#ffbb22; }
            .tucne { font-weight: bold; }
        </style>
    </head>

<body>
    <h1>Web o oskeruši</h1>
    <p class="tucne">Na tomto webu se dočtete spoustu věcí o oskeruši.</p>
    <h2>Obsah</h2>
    <ul>
        <li><a href="index.html">Úvodní stránka</a>
        <li><a href="stanoviste.html">Stanoviště oskeruše</a>
        <li><a href="vzhled.html">Jak oskeruše vypadá</a>
        <li><a href="drevo-plod.html">Využití dřeva a zpracování plodu</a>
        <li><a href="ochrana.html">Oskeruše – ohrožený rostlinný druh</a>
    </ul>
    <p>A jedeme dál, klikněte prosím na odkaz, který vás zajímá!</p>
</body>
</html>

2. Tento text ulož jako soubor stanoviste.html v kódování utf-8
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8">
        <title>Stanoviště oskeruše</title>
        <meta name="description" content="Tato stránka je o stanovišti oskeruše.">
        <style>
            body, p, ul, li { color:#550000; background-color:#ffbb22; }
            .tucne { font-weight: bold; }
        </style>
    </head>

<body>
    <h1>Stanoviště oskeruše</h1>
    <ul>
        <li><a href="index.html">Úvodní stránka</a>
        <li><a href="stanoviste.html">Stanoviště oskeruše</a>
        <li><a href="vzhled.html">Jak oskeruše vypadá</a>
        <li><a href="drevo-plod.html">Využití dřeva a zpracování plodu</a>
        <li><a href="ochrana.html">Oskeruše – ohrožený rostlinný druh</a>
    </ul>
    <p>Oskeruše vyžaduje teplé a slunné stanoviště.</p>
    <p>A jedeme dál, klikněte prosím na odkaz, který vás zajímá!</p>
</body>
</html>

3. Tento text ulož jako soubor vzhled.html v kódování utf-8
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8">
        <title>Vzhled oskeruše</title>
        <meta name="description" content="Oskeruše je ovocný strom ztepilé postavy, zjara kvetoucí.">
        <style>
            body, p, ul, li { color:#550000; background-color:#ffbb22; }
            .tucne { font-weight: bold; }
        </style>
    </head>

<body>
    <h1>Vzhled oskeruše</h1>
    <ul>
        <li><a href="index.html">Úvodní stránka</a>
        <li><a href="stanoviste.html">Stanoviště oskeruše</a>
        <li><a href="vzhled.html">Jak oskeruše vypadá</a>
        <li><a href="drevo-plod.html">Využití dřeva a zpracování plodu</a>
        <li><a href="ochrana.html">Oskeruše – ohrožený rostlinný druh</a>
    </ul>
    <p class="tucne">Oskeruše roste sice pomalu, nicméně spolehlivě zdola nahoru a od středu do stran. Má zelené listí. Kvete na jaře.</p>
<img src="oskeruse.jpg" width="600" height="80">
    <p>A jedeme dál, klikněte prosím na odkaz, který vás zajímá!</p>
</body>
</html>

4. Tento text ulož jako soubor drevo-plod.html v kódování utf-8
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8">
        <title>Využití dřeva a plodu oskeruše</title>
        <meta name="description" content="Tato stránka se věnuje využití dřeva a plodů oskeruše.">
        <style>
            body, p, ul, li { color:#550000; background-color:#ffbb22; }
            .tucne { font-weight: bold; }
        </style>
    </head>

<body>
    <h1>Využití dřeva a zpracování plodu oskeruše</h1>
    <ul>
        <li><a href="index.html">Úvodní stránka</a>
        <li><a href="stanoviste.html">Stanoviště oskeruše</a>
        <li><a href="vzhled.html">Jak oskeruše vypadá</a>
        <li><a href="drevo-plod.html">Využití dřeva a zpracování plodu</a>
        <li><a href="ochrana.html">Oskeruše – ohrožený rostlinný druh</a>
    </ul>
    <p class="tucne">Dřevo i plody oskeruše se nabízí k k mnohostrannému využití. Dřevo je velmi cenné a na aukcích se prodává za astronomické částky. Z plodů se vyrábí exkluzivní pálenka.</p>
    <p>A jedeme dál, klikněte prosím na odkaz, který vás zajímá!</p>
</body>
</html>

5. Tento text ulož v kódování utf-8 jako soubor ochrana.html
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8">
        <title>Ohrožení a ochrana oskeruše</title>
        <meta name="description" content="Oskeruše je ohrožený druh stromu a její výskyt je třeba podporovat.">
        <style>
            body, p, ul, li { color:#550000; background-color:#ffbb22; }
            .tucne { font-weight: bold; }
        </style>
    </head>

<body>
    <h1>Oskeruše – ohrožení a možnosti ochrany</h1>
    <ul>
        <li><a href="index.html">Úvodní stránka</a>
        <li><a href="stanoviste.html">Stanoviště oskeruše</a>
        <li><a href="vzhled.html">Jak oskeruše vypadá</a>
        <li><a href="drevo-plod.html">Využití dřeva a zpracování plodu</a>
        <li><a href="ochrana.html">Oskeruše – ohrožený rostlinný druh</a>
    </ul>
    <p class="tucne">Oskeruše je opomíjený druh dřeviny a je nutno ji dnes počítat k ohroženým rostlinným druhům. Kontaktujte <a href="www.agrocr.cz/kontakt.php" target="_blank">Agrární komoru České republiky</a> a ptejte se na možnosti podpory v otázkách výsadby a pěstění tohoto stromu.</p>
    <p>Klikněte prosím na odkaz, který vás zajímá!</p>
</body>
</html>

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0