|
Ocena wątku:
- 1 głosów - średnia: 1
- 1
- 2
- 3
- 4
- 5
|
rollover + czytanie z dokumentu
|
Liczba postów: 22
Liczba wątków: 4
Dołączył: 07-05-2012
Reputacja:
0
14-05-2012, 13:17
(Ten post był ostatnio modyfikowany: 14-05-2012, 13:32 przez raxiq.)
Liczba postów: 367
Liczba wątków: 32
Dołączył: 22-04-2009
Reputacja:
9
14-05-2012, 14:31
(Ten post był ostatnio modyfikowany: 14-05-2012, 14:33 przez Radian.)
http://ferrante.pl/frontend/javascript/jquery-to-latwe-1/
zobacz sobie to, są tu 3 lekcje do jquery
a tu przykład: http://ferrante.pl/frontend/javascript/jquery-to-latwe-3/
chyba o to ci chodzi ?
Div nie musi zmieniać stylu, height zmieni się automatycznie gdy tekst będzie dłuższy i nie będzie sie w nim mieścił.
Poniżej znowu masz liste wywoływania zdarzeń w javascript:
http://www.doman.art.pl/kursjs/kurs/events.html
Zamiast klikania może być najechanie myszką nad element itd. itd.
Liczba postów: 22
Liczba wątków: 4
Dołączył: 07-05-2012
Reputacja:
0
Generalnie moim głównym problemem nie jest stworzenie elementu, który będzie się rozsuwał tak jak np menu.
Interesuje mnie przede wszystkim jak przerobić wskazany przeze mnie kod tak, aby we wskazanym divie wyświetlał tekst np z pliku txt/html, znajdującego się w tym samym katalogu. Ewentualnie mogę zrobić tak, a nawet to będzie chyba wygodniejsze, żeby była wyświetlana zawartość diva nr 1(którego zawartość sobie ukryje poprzez display:none) w divie nr 2, po najechaniu myszką/kliknięciu myszką w dany element w tym wypadku element tekstowy-nazwisko danej osoby. To jest dla mnie najważniejsze, a z samym rozsuwaniem chyba sobie poradzę. Moje dywagacje były na temat tego co jest po prostu wygodniejsze ;p
Mimo wszystko thx za poradnik do jQuery, kiedyś skorzystam na pewno, aczkolwiek na chwile obecną zależy mi jedynie na tym drobnym zabiegu.
Liczba postów: 367
Liczba wątków: 32
Dołączył: 22-04-2009
Reputacja:
9
Lepiej zdecydowanie jest ukryć diva i pokazywać przy pomocy javascript:
<!DOCTYPE html>
<html>
<head>
<style>
p { background:yellow; }
</style>
<script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
<button>Show it</button>
<p style="display: none">Hello 2</p>
<script>
$("button").click(function () {
$("p").show("slow");
});
</script>
</body>
</html>
Sam na javascript znam się średnio :p
http://api.jquery.com/show/
Ale z tego co widzę do show() hide() odpowiada w jQuery za pokazywanie i ukrywanie diva.
Liczba postów: 22
Liczba wątków: 4
Dołączył: 07-05-2012
Reputacja:
0
DOBRE ! O coś takiego mi chodziło, może uda mi się to jakoś połączyć z onClick etc. i uzyskam bezpośrednio to co chcę!
Dzięki wielkie.
Liczba postów: 22
Liczba wątków: 4
Dołączył: 07-05-2012
Reputacja:
0
16-05-2012, 13:46
(Ten post był ostatnio modyfikowany: 16-05-2012, 13:57 przez raxiq.)
Liczba postów: 252
Liczba wątków: 10
Dołączył: 06-02-2012
Reputacja:
14
20-05-2012, 18:33
(Ten post był ostatnio modyfikowany: 20-05-2012, 18:34 przez camelrafal.)
wyśrodkowanie osiągniesz przez
Kod: margin-left:auto;
margin-right:auto;
no i musisz podać konkretną lub mniej konkretną(w%) szerokość strony(kontenera)
a w kontenerze to już sobie układasz jak chcesz i co chcesz
Liczba postów: 252
Liczba wątków: 10
Dołączył: 06-02-2012
Reputacja:
14
w kodzie generalnie nie zauważyłem jakiegoś rażącego błędu który mógłby to powodować (przesunięcie 1px) [musiałbyś podać cały kod]
ale co zauważyłem to to że dziwnie nadajesz nazwy id i class
masz id o nazwie body który może ci się mylić z sekcją body dla strony
tak jak i id="menu" i class="menu"
niby jest to poprawnie ale łatwo można popełnić błąd
w stylu masz zapewne sekcje
#menu{}
jak i sekcje
.menu{}
jeżeli będziesz pamiętał które jest które to w porządku tylko lepiej jest stosować id zamiast class jeżeli element występuje na stronie tylko raz(tak jak twoje menu)
natomiast jeżeli na stronie będzie się znajdowało wiele elementów które będą współdzieliły ten sam styl wtedy używasz class
Liczba postów: 22
Liczba wątków: 4
Dołączył: 07-05-2012
Reputacja:
0
Możliwe, że gdzieś jest ten błąd, mam prośbę zerknij w takim razie jak możesz resztę kodu, może Ty znajdziesz to czego ja nie widzę ;p
Kod: html, body {
margin:0;
padding:0;
font-size:11px;
font-family:Tahoma, Helvetica, sans-serif;
color:#d0d0d0;
line-height:1.4em;
}
body {
margin: 0;
padding:0;
background: url(backgroundlayout.png) no-repeat center;
background-color: black;
border: 0;
}
img {
border:0;
}
a:link, a:visited {
text-decoration:underline;
color:white;
border:0;
}
a:hover {
color:#f7bf00;
}
/* Struktura */
div#logo {
margin: 0;
padding:0;
width: 960px;
height: 231px;
background-color: grey;
}
div#menu {
margin: 0;
padding:0;
width:960px;
height:39px;
}
div#container {
margin: 0;
padding:0;
width:960px;
height:643px;
}
div#footer {
margin: 0;
padding:0;
clear:both;
font-size:0.9em;
width: 960px;
height: 62px;
}
/* MENU */
ul.menu, ul.menu li {
height:39px;
display: inline;
margin: 0;
padding: 0;
list-style: none;
}
ul.menu li {
float:left;
}
ul.menu a:link, ul.menu a:visited {
float:left;
height:39px;
display: block;
color:#8d8d8d;
text-decoration: none;
text-align: center;
font-size:1.1em;
margin: 0;
padding: 0;
}
ul.menu a:hover {
color:white;
background:#2b2b2a;
margin: 0;
padding: 0;
}
body#index ul.menu a#link0:link, body#index ul.menu a#link0:visited,
body#onas ul.menu a#link0:link, body#onas ul.menu a#link0:visited,
body#zakres ul.menu a#link1:link, body#zakres ul.menu a#link1:visited,
body#zaufaj ul.menu a#link2:link, body#zaufaj ul.menu a#link2:visited,
body#referencje ul.menu a#link5:link, body#referencje ul.menu a#link5:visited,
body#cennik ul.menu a#link5:link, body#cennik ul.menu a#link5:visited
{
color:white;
background:#2b2b2a;
margin: 0;
padding: 0;
}
/* CONTENT */
div#content_main {
width:600px;
height: 643px;
float: left;
margin: 0;
padding: 0;
}
div#content_main p:hover {
color: red;
}
div#content_right {
float:right;
width:360px;
height: 643px;
color:#a1a1a1;
line-height:1.3em;
margin: 0;
padding: 0;
}
div#content_contact {
float:right;
width:340px;
height:303px;
color:#a1a1a1;
background-color: #696969;
line-height:1.3em;
margin: 0;
padding: 0;
}
div#content_location {
float:right;
width:340px;
height: 340px;
color:#a1a1a1;
background-color: #2F4F4F;
line-height:1.3em;
margin: 0;
padding: 0;
}
/* FOOTER */
#footer_left {
float:left;
width: 480px;
height: 62px;
text-align:left;
margin: 0;
padding: 0;
}
#footer_right {
float:right;
width: 480px;
height: 62px;
font-size:1em;
text-align:right;
margin: 0;
padding: 0;
}
#footer a:link, #stopka a:visited, #stopka_right {
color:#474747;
text-decoration:none;
}
#footer a:hover {
color:#fff;
text-decoration:underline;
}
Jeżeli chodzi, o css, to pozwoliłem sobie po prostu zapożyczyć z pewnej dobrze napisanej strony, jak szablon/podstawę dla mnie. Dzięki temu mogę trzymać się jakiejś dobrej struktury i łatwiej mi się uczyć na tym. Sam takiego nie napiszę, a z edycją i czytaniem znaczników raczej nie mam problemu.
I teraz tak: chcę wstawić background jako tło tak aby było widoczne po bokach - więc 1px x 975px w moim wypadku, wstawiam do sekcji html, body tak ? Jak tam widać jakieś niejasności to walcie śmiało ;p lepiej poprawiać teraz jak później  [/align]
Liczba postów: 252
Liczba wątków: 10
Dołączył: 06-02-2012
Reputacja:
14
21-05-2012, 22:44
(Ten post był ostatnio modyfikowany: 21-05-2012, 22:49 przez camelrafal.)
background wstawiasz w body
tam widze że masz już background tylko że bez-powtarzania(no-repeat) a powinieneś mieć z powtarzaniem-x(repeat-x)
czyli:
Kod: body {
margin: 0;
padding:0;
background: url(backgroundlayout.png) repeat-x center, black;
border: 0;
}
a co do tego przesunięcia 1px to skopiowałem ten kod co podałeś i u mnie wszystko jest ok i na firefox i na opera
|
Użytkownicy przeglądający ten wątek:
|
|
|
Sponsorzy i przyjaciele
|
|
|
rollover + czytanie z dokumentu
