Witam.
Jestem w trakcie tworzenia strony www gdzie w headerze znajdują się zdjęcia wyświetlane na całą szerokość strony przy stałej wysokości diva (id="top") w którym są umieszczone.
Chodzi o to że, jeżeli odpalimy to na małym ekranie to wysokość zdjęcia jest za mała i widać tło pod i nad zdjęciem. A z drugiej strony gdy wyświetlimy to na urządzeniu posiadającym wysoką rozdzielczość obraz jest bardzo duży i spora jego część jest ucięta od spodu i od góry. Można to zaobserwować podczas zwężania okna przeglądarki.
Powinno to wyglądać tak jak tutaj: http://www.redington.com/
Na chwilę obecną udało mi się zrobić tylko coś takiego:
-
http://ntmmed.webd.pl/tiptop/index.php
Mam jeszcze problem z walidacją formularzy. A dokładniej z porównaniem haseł aby te były identyczne. Używam do tego jquery.validate.js, nie ważne jak mocno próbuje zawsze wyświetla mi że hasła nie są takie same, mimo tego iż wpisuje identyczne wartości.
Formularz:
<form class="register" id="register" method="post" action="index.php?view=register">
<fieldset>
<p class="register">
<label for="imie">Imię:</label>
<input id="imie" name="imie" type="text">
</p>
<p class="register">
<label for="nazwisko">Nazwisko:</label>
<input id="nazwisko" name="nazwisko" type="text">
</p>
<p class="register">
<label for="adres">Adres (ulica i numer domu)</label>
<input id="adres" name="adres" type="text">
</p>
<p class="register">
<label for="kod_pocztowy">Kod Pocztowy:</label>
<input id="kod_pocztowy" name="kod_pocztowy" type="text">
</p>
<p class="register">
<label for="miasto">Miasto:</label>
<input id="miasto" name="miasto" type="text">
</p>
<p class="register">
<label for="email">E-Mail (required)</label>
<input id="email" type="email" name="email">
</p>
<p class="register">
<label for="telefon">Telefon:</label>
<input id="telefon" type="digits" name="telefon">
</p>
<p class="register">
<label for="haslo">Hasło:</label>
<input id="haslo" type="password" name="haslo">
</p>
<p class="register">
<label for="haslo2">Powtórz Hasło:</label>
<input id="haslo2" type="password" name="haslo2">
</p>
<p>
<input class="button" type="submit" value="rejestruj">
</p>
</fieldset>
</form>
Walidacja:
$().ready(function() {
$("form#register").validate({
rules: {
imie: {
required: true,
minlength: 2
},
nazwisko: {
required: true,
minlength: 2
},
kod_pocztowy: "required",
miasto: "required",
adres: {
required: true,
minlength: 2
},
haslo: {
required: true,
minlength: 3
},
haslo2: {
required: true,
equalTo: "#haslo"
},
email: {
required: true,
email: true
},
telefon: {digits: true}
},
messages: {
imie: {
required: "ProszÄ podaÄ imiÄ",
minlength: "ImiÄ musi mieÄ conajmniej 2 znaki"
},
nazwisko: {
required: "ProszÄ podaÄ nazwisko",
minlength: "Nazwisko musi mieÄ conajmniej 2 znaki"
},
adres: {
required: "ProszÄ wpisaÄ adres",
minlength: "Adres musi mieÄ conajmniej 2 znaki"
},
haslo: {
required: "ProszÄ wpisaÄ hasĹo",
minlength: "HasĹo musi mieÄ conajmniej 3 znaki"
},
haslo2: {
required: "ProszÄ wpisaÄ hasĹo",
equalTo: "HasĹa muszÄ byÄ identyczne"
},
email: "ProszÄ podaÄ adres email",
kod_pocztowy: "ProszÄ podaÄ kod pocztowy",
miasto: "ProszÄ podaÄ miasto",
telefon: "ProszÄ wpisaÄ tylko liczby"
}
});
});