i have site in development, http://melanie.3drexstaging.com/ client wants background scale or down (to point) depending on browser size. have gotten work halfway decent jquery hacks adjust sizing of elements browser resizes, prefer css option. have 3 images, 1 fixed aspect ratio center image should show in entirety, , left , right have images continue pattern.
thanks in advance tips!
my sad javascript hacks:
<script type="text/javascript"> $(document).ready(function () { fixbg(); }); $(window).load(function () { fixbg(); }); $(window).resize(function () { fixbg(); }); function fixbg() { var mh = math.max($(window).height(), 768); if ($("#controlbar").length > 0) { mh -= 54; } var mw = math.round((mh / 768) * 1264); var winw = math.max(1264, $(window).width()); $("#bgcenter").height(mh).width(mw); $("#shade").height(mh).width(mw).css("left", ((winw - mw) / 2) + 10); var = ((winw - mw) / 2) + 10; $(".bgfillers").width(extra).height(mh); var bgw = (mh / 768) * 360; $(".bgfillers").css("background-size", bgw + "px " + mh + "px"); //$("#sitecontent").css("min-height", mh - $("#header").height() - $("#footer").height() - 20); } </script> and basic markup:
<div id="master"> <div id="bg"> <div id="bgleft" class="bgs bgfillers"></div> <div id="bgcenter" class="bgs"> </div> <div id="bgright" class="bgs bgfillers"></div> </div> <div id="shade"></div> <div id="centeredsite"> </div> </div>
have tried making size relative?
you use % instead of px (or other option)
100% full element, 50% half element (if put in div set 50% it'll take half of div that's taking half of page, 1/4th of page)
otherwise i'll need more information
Comments
Post a Comment