Zaloguj się

kuki · (Ten post był ostatnio modyfikowany: 07-03-2012, 02:20 przez kuki.)

Witam
Zacznę od tego że widziałem na tym forum post na którym ktoś pytał jak cos takiego wykonać i podał linka do strony - niestety jak nazłość nie mogę zaleście tego posta więc dlatego kieruje do was to pytanie.

Chciał bym by po najechaniu na linka na stronie automatycznie ładował sie DIV (był by on niewielkim kwadratem informującym o kontakcie po najechaniu na linka kontakt.
W chwili obecnej mam niewiele ale to co mam:

Kod:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl">

<head>

  <meta http-equiv="Content-type" content="application/xhtml+xml; charset=iso-8859-2" />

  <meta name="Description" content=" [wstaw tu opis strony] " />

  <meta name="Keywords" content=" [wstaw tu slowa kluczowe] " />

  <meta name="Author" content=" [dane autora] " />

  <meta name="Generator" content="kED" />

  <title> [tytuł strony] </title>

  <link rel="stylesheet" href="style.css" type="text/css" />

</head>

<body>

 <div class="NAGLOWEK"> test </div>

 <div class="menu"; >

 <ul>

 <li><a href="#">test</a></li>

 <li><a href="#">usługi</a></li>

 <li><a href="#">kontakt</a></li>

 <li><a href="#">godziny otwarcia</a></li>

 </ul>

 </div>

 </body>

</html>

----------------------------------------------------------------------------------
CSS/
----------------------------------------------------------------------------------

Kod:
html, body {

    background-color: white;

    color: #000;

    margin: 0;

    padding: 0;

    height: 100%

}

.top {

    width: 780px;

}

.NAGLOWEK {

    background-color: #888

    width: auto;

    height: 60px;

}

.MENU {

    width: auto;

    height: auto;

    float: center;

    text-align:center;

    margin:0;

    background-color: white;

}

.STOPKA {

    clear: both;

    width: 100%;

    background-color: #888;

}

ul li {

    display: inline;

    text-align: center;

    height:1px;

    margin-left:1cm;

    margin-right:1cm;

}

a { 

 text-decoration: none; 

}

----------------------------------------------------------------------------------
dodałem załącznik by nieco bardziej wyjaśnić
.png

przyklad.PNG (Rozmiar: 9.35 KB / Pobrań: 12)

Zawiii · 06-03-2012, 05:09

chyba najłatwiej by było jako tooltip w jquery to zrobić. Ewentualnie jakis skrypcik dodający .class przy onmouseover albo hover.
O ile dobrze rozumuje założenia Smile

kuki · (Ten post był ostatnio modyfikowany: 06-03-2012, 13:50 przez kuki.)

jeśli chodzi jquery to znalazłem:
http://www.webmastertalk.pl/ladowanie-podstron-w-div-problem-t-4470.html
jesli chodzi jakiś skrypcik dodający .class przy onmouseover albo hover to coś zdarzyłem przeczytać ale jak to wykonać tego nie wiem.
reasumując poruszając sie po stronie HTML oraz CSS nie jestem wstanie tego wykonać ?

Ewentualnie czy mógł bym prosić o mały przykaład ".class przy onmouseover albo hover."

kuki · 07-03-2012, 02:19

by nie zakladac nowego wątku mam pytanie czemu DIV-y po wpisaniu poniższego nie przylegaja do siebie w poziomie ?

Kod:
.NAGLOWEK {

    background-color: blue;

    width: auto;

    height: 60px;

    position: relative;

    margin  : 0px;

  border  : none;

  padding : 0px;

}

.MENU {

    width: auto;

    height: auto;

    text-align:center;

    background-color:black;

    margin  : 0px;

  border  : none;

  padding : 0px;

}

.TRESC {

    width: 630px;

    height:auto;

    overflow: hidden;

    background-color:green;

    text-align:center;

    margin-left: 4cm;

    margin-top: 0px;

  border  : none;

  padding : 0px;

}

**Kartofelek** · 07-03-2012, 03:19

Odpowiedź jest prosta. Po ten kod jest bez sensu Smile

kuki · (Ten post był ostatnio modyfikowany: 07-03-2012, 03:45 przez kuki.)

Każda odpowiedz jest dobra Smile

kod zmieniłem

Kod:
html, body {

    background-color: orange;

    color: #000;

    height:100%;

    margin:0px 10px 0px 10px;

}

.NAGLOWEK {

    background-color: blue;

    width: auto;

    height: 60px;

    position: relative;

}

.MENU {

    width: auto;

    height: 10px;

    text-align:center;

    background-color:black;

}

.TRESC {

    width: 630px;

    height:600;

    background-color:green;

    text-align:center;

}

Po usunięci auto z .MENU odstęp zniknął
jeszcze tylko pozostaje by hiperłącza w postaci tekstu umieścić na samym dole DIV-a

@Kartofelek co do kody pewnie przez pewien czas będzie jeszcze bez sensu ale to okres eksperymentów

@kornel_webmaster mimo zmiany dobrze wiedzieć

kuki · 07-03-2012, 03:47

DIV .MENU

a tu wpis z html-a

Kod:
<div class="menu"; >

 <ul>

 <li><a href="#">test</a></li>

 <li><a href="#">usługi</a></li>

 <li><a href="#">kontakt</a></li>

 <li><a href="test.html">menu</a>

 </li>

 </ul>

kuki · 07-03-2012, 04:06

@kornel_webmaster Dzieki

Zaloguj się
Login:
Hasło:	Nie pamiętam hasła
	Zapamiętaj mnie