Autorius Tema: elementai leidziasia kartu su puslapiu  (Skaityta 1602 kartus)

Neprisijungęs nubik1311

  • Naujokas
  • *
  • Įrašai: 7
  • Karma: +0/-0
    • Žiūrėti profilį
elementai leidziasia kartu su puslapiu
« Įrašytas: 2014-05-12 21:07:27 pm »
Labas vakaras, taigi, kai kurie elementai juda kartu su puslapiu (jeigu pakeist puslapio dydį ir sukt i apačia, tai kai kurie elementai irgi važiuoja),o kai kurie ne . CSS pastačiau
position:fixed
Kas gali buti netaip.
« Paskutinį kartą keitė: 2014-05-12 21:11:47 pm sukūrė nubik1311 »

Neprisijungęs Lukas

  • Administratorius
  • Herojus
  • ******
  • Įrašai: 7431
  • Karma: +232/-15
    • Žiūrėti profilį
Ats: elementai leidziasia kartu su puslapiu
« Atsakymas #1 Įrašytas: 2014-05-12 23:39:11 pm »
1000x dalyku :D reikia ziureti koda :) inspect element ir ziurek ka ten susigeneruoja, gal paveldi kazka, gal koks !important kur numestas ar dar kas.
Jūsų draugas, kolega ir puslapio administratorius,

Lukas.

Gerda Photography
Serveriai.lt 50% nuolaida!
Free Hosting
Free Templates

Neprisijungęs nubik1311

  • Naujokas
  • *
  • Įrašai: 7
  • Karma: +0/-0
    • Žiūrėti profilį
Ats: elementai leidziasia kartu su puslapiu
« Atsakymas #2 Įrašytas: 2014-05-13 00:02:24 am »
Kodas vat cia kaip pvz:
.buitine_technika  {
   background:url(images/kategorijos.jpeg);
   position: fixed;
   top: 150px;
   left: 470px;
   width: 150px;
   height: 150px;
   text-align: center;
   color: white;   
}
.nekilnojamas_turtas  {
   background:url(images/kategorijos.jpeg);
   position:fixed;
   top: 150px;
   right: 500px;
   width: 150px;
   height: 150px;
   text-align: center;
   color: white;
}

Bandžiau ivairiai, pvz: vietoj position rasyt background-attachment. arba pvz
background:url(images/kategorijos.jpg) no-repeat fixed;

O pvz yra elementu kurie absolute, ir tas elementas nesisuka, nesisuka. O cia visaip bandziau ir absolute ir fixed vistiek sukasi
« Paskutinį kartą keitė: 2014-05-13 00:04:39 am sukūrė nubik1311 »

Neprisijungęs Haris

  • Dalyvis
  • **
  • Įrašai: 833
  • Karma: +56/-0
    • Žiūrėti profilį
    • www.RubikoKubas.Lt
Ats: elementai leidziasia kartu su puslapiu
« Atsakymas #3 Įrašytas: 2014-05-13 02:11:19 am »
Tu netaip supratai position parametra.

Fixed - Elementas bus 'priklijuotas prie ekrano' t.y  kokias koordinates davei tam elementui ten jis visa laika ir bus, kad ir kiek scrollintum.
Absolute - Panasiai kaip fixed, tik elementas nebus 'prilipdytas prie ekrano'. Kai elementas su absolute pozicija yra elemente su relative pozicija, tada tas absolute elementas bus priklausomas nuo parent elemento, tai reiskia, kad elementas su absolute koordinatem bus generuojamas tik toje dezuteje kuri turi relative pozicija. pvz:

Kodas: (html) [Pasirinkti]
<style>
#parent {
  position:relative;
  width: 500px;
  height: 100px;
  margin: 0px auto;
  border: 1px solid red;
}
#child {
  position: absolute;
  width: 10px;
  height: 10px;
  top: 20px;
  left: 100px;
  border: 1px solid green;
}
</style>
<div id="parent">
  <div id="child">
   
  </div>
</div>

Siuo atveju #parent bus puslapio virsuje(nesiscrollins kartu su puslapiu), o #child bus pastumtas 20px nuo virsaus 100px nuo kaires #parent dezutes sienos.
Jeigu #parent neturetu position:relative;, tada #child butu pastumtas nuo kaires ir virsaus tiek pat pixeliu, bet nebe nuo #parent dezutes sienu, o nuo pacios narsykles krastiniu.

Relative - Su situo gali stumdyti elementa is jo statines vietos.

http://www.barelyfitz.com/screencast/html-training/css/positioning/ Cia su pavyzdziais yra gerai paaiskinta :) Ir beto, kaip Lukas minejo, naudok Inspect element, zymiai palengvins front-end kurima :)

Manualai.lt Forumas

Ats: elementai leidziasia kartu su puslapiu
« Atsakymas #3 Įrašytas: 2014-05-13 02:11:19 am »

Neprisijungęs nubik1311

  • Naujokas
  • *
  • Įrašai: 7
  • Karma: +0/-0
    • Žiūrėti profilį
Ats: elementai leidziasia kartu su puslapiu
« Atsakymas #4 Įrašytas: 2014-05-13 02:56:53 am »
Pasiskaičiau iskart daug kas paaiškejo . Ačiu )

Neprisijungęs Lukas

  • Administratorius
  • Herojus
  • ******
  • Įrašai: 7431
  • Karma: +232/-15
    • Žiūrėti profilį
Ats: elementai leidziasia kartu su puslapiu
« Atsakymas #5 Įrašytas: 2014-05-13 10:18:57 am »
tikrai geras Hario atsakymas ;)

dar del "inspect element", tai jei nori tikrai gerai ismokt debuginimo toolsus naudot, siulau sita pereit: http://discover-devtools.codeschool.com/?locale=en

tai tau ispres labai daug bedu susijusiu tiek su frontend, tiek su backend'u (headers, cache, timing ir t.t.).
Jūsų draugas, kolega ir puslapio administratorius,

Lukas.

Gerda Photography
Serveriai.lt 50% nuolaida!
Free Hosting
Free Templates

Manualai.lt Forumas

Ats: elementai leidziasia kartu su puslapiu
« Atsakymas #5 Įrašytas: 2014-05-13 10:18:57 am »