Post Reply 
 
Thread Rating:
  • 0 Votes - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
html/css pomoc za 1$
» bolja sa dvije strane + centar za 1$
01-03-2012, 12:06 PM (This post was last modified: 01-03-2012 12:07 PM by nesim.)
Post: #1
html/css pomoc za 1$
Evo imam prikaz kako bi to trebalo izgledati:

Gosti i korisnici koji nisu aktivirali svoj račun ne mogu vidjeti linkove u porukama. Da bi vidjeli linkove registrirajte se ovdje ili aktivirajte svoj račun klikom na konfirmacijski link u e-mailu.

Bilo bi:
- centralni dio (zeleni) - fiksna sirina, max duzina (duzina zavisi od sadrzaja teksta koji se nalazi u tom box-u)
- left (plavi) - nije fiksna sirina - zavisi od sirine browsera, max duzina
- right (crveni) - nije fiksna sirina - zavisi od sirine browsera, max duzina


Vidite na dnu crnu liniju, to znaci da ukoliko stranica ne moze da stane sva odjednom, da ce se "scroll-at" prema dole. I sada i tu ima probema:
- ukoliko centralni dio (zeleni) ne moze da stane, i sada kada se scroll-a prema dole da se i plavi a i crveni po visini produzuju

Odnosno meni treba samo ovaj centralni (zeleni) dio da sadrzi neki sadrzaj, dok bi ove sa strane boje bila samo pozadina.

Pokusavao sam sinoc i bas mi ne ide, ako ima neko dobar da mi pomogne, saljem i 1$ Biggrin
Send this user an email Find all posts by this user
Quote this message in a reply Thank you
01-03-2012, 02:22 PM
Post: #2
RE: html/css pomoc za 1$
Pa odradi pozadinu sa fiksnim centralnim delom i stavi da se ponavlja po x osi.
Visit this user's website Find all posts by this user
Quote this message in a reply Thank you
02-03-2012, 10:07 PM
Post: #3
RE: html/css pomoc za 1$
Možda ti ovako nešto može pomoći.

HTML
Code:
<body>
    
        <div class="plavo">
            <div class="crveno">
                <div class="zeleno">
                </div>
            </div>
        </div>
    
    
</body>

CSS
Code:
body {
    margin:0;
    padding:0;
}
div {
    overflow:hidden;
}
.plavo {
    background: #00F;
}
.crveno {
    background: #F00;
}
.zeleno {
    background: #0F0;
    width:960px;
}

jQuery
Code:
<script type="text/javascript" language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
var screen_height = $(window).height();
var screen_width = $(window).width();
var g_width = (screen_width - 960) / 2;
var red_width = g_width + 960;
$(document).ready(function() {
$('.zeleno').css({'height' : screen_height});
$('.crveno').css({'margin-left' : g_width, 'width' : red_width});
});
</script>

Ako neodgovara, naćiću ti neko drugo rešenje.
Send this user an email Find all posts by this user
Quote this message in a reply Thank you
Thanks given by (1): Vatra Wolf
02-03-2012, 11:58 PM
Post: #4
RE: html/css pomoc za 1$
Primer II

HTML
Code:
<body>    
        <div class="plavo">
            <div class="crveno">
                <div class="zeleno">
                </div>
            </div>
        </div>  
</body>

CSS (napravi liniju crvene boje - "height 5px , width 960px")
Code:
body {
    margin:0;
    padding:0;
}
div {
    overflow:hidden;
}
.plavo {
    background: #00F;
}
.crveno {
    background-image: url(img/red.jpg);
    background-position:right;
    background-repeat:repeat-y;
}
.zeleno {
    background: #0F0;
    margin: 0 auto;
    width:960px;
}

jQuery (ako želiš da srednji/zeleni box bude minimalne visine indetičan visini prozora)
Code:
<script type="text/javascript">
var screen_height = $(window).height();
$(document).ready(function() {
$('.zeleno').css({'min-height' : screen_height});
});
</script>
Send this user an email Find all posts by this user
Quote this message in a reply Thank you
03-03-2012, 02:56 AM
Post: #5
RE: html/css pomoc za 1$
Skini Maestro, program iz mog potpisa. Sve što ti treba možeš uraditi sa njim. U Trial verziji limit mi je 400px u širinu ali pošto nemaš nikakvih slika jednostavno u kodu zameni 400 sa 960 i sve ti radi. program će ti napraviti i faux columns automatski.

Djordje Stanic
------------------

http://www.creativetemplatedesigner.com
Software for making joomla templates
http://www.digitalnikuvar.com
Send this user an email Visit this user's website Find all posts by this user
Quote this message in a reply Thank you
Post Reply 


Possibly Related Threads...
Thread: Author Replies: Views: Last Post
  Ispravni HTML adikcija 3 539 07-07-2013 07:48 PM
Last Post: adikcija
  HTML & CSS u 30 dana ativar 3 714 15-03-2012 01:05 PM
Last Post: M00nlander
  Kako centrirat html stranicu mucacos 2 727 12-03-2012 11:59 PM
Last Post: nesim
  HTML Decko27god 9 996 15-06-2011 05:23 AM
Last Post: sanjko
  VirtueMart i Joomfish (potrebno editovanje html koda) Jokja 4 800 14-03-2011 09:02 PM
Last Post: Jokja
  HTML tutorial Joza95 4 1,836 10-03-2010 06:17 PM
Last Post: rigor04

Forum Jump:


User(s) browsing this thread: 1 Guest(s)