I'm trying to implement the Zooming out/in(browser) only on visible area of website exactly like site http://halfcreative.themes.bitfade.com/. When you zoom out or in, only visible area zooms in or out. I googled for it but didn't find the answer. Any idea how to do this?
Asked
Active
Viewed 470 times
0
-
1Can you be a bit more specific ? With "zoom", do you mean zooming with your browser ? – Andri Jul 01 '13 at 08:02
-
@Andri Yes, zooming the browser. – Alex Polly Jul 01 '13 at 08:03
-
2your question should not be dependent on external resources. This question will make no sense if they redesign (not that it makes sense now). – John Dvorak Jul 01 '13 at 08:04
-
You mean that: when you open the page and zoom in and out: the visible content stays the same and you can't see more than before (it's just smaller) ? ^^ – Andri Jul 01 '13 at 08:05
-
Here is a similar question that may help you: http://stackoverflow.com/questions/13886763/disable-zoom-on-a-div-but-allow-zoom-on-the-page-an-alternate-div – Matthias Holdorf Jul 01 '13 at 08:06
-
@Andri Yeha, exactly like that – Alex Polly Jul 01 '13 at 08:06
-
Use firebug/web console to figure it out yourself - or at least make a start. Hint: it's CSS. – RobH Jul 01 '13 at 08:07
2 Answers
1
You mean this effect? Check DEMO http://jsfiddle.net/bJnCV/
HTML
<div id="home">
<h1>Site Name</h1>
<p>This is slogan</p>
</div>
JQUERY
$(document).ready(function(){
$('#home').css({'width':$(window).width(),'height':$(window).height()});
});
$(window).resize(function() {
$('#home').css({'width':$(window).width(),'height':$(window).height()});
});
yeyene
- 7,297
- 1
- 21
- 29
0
Take a look at the CSS of the site. (min-)height: 100%; is a keyword.
header {
width: 100%;
height: 100%;
text-align: center;
color: #FFF;
position: absolute;
background: rgba(0, 0, 0, 0) no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
background-attachment: fixed;
min-width: 100%;
min-height: 100%;
}
Andri
- 553
- 4
- 20