If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

Personally, I dislike the full screen background auto changing on the site you linked. I find it distracting. Also it has a hole in the middle where it is overlaid by the hotel logo (though that can be largely suppressed). JQuery is used to achieve the animated background.

I also note that:
- When viewed on a PC sized screen or window (i.e. 768px wide and above) the full screen background is displayed auto changing.
- When viewed on a mobile sized screen or window (i.e. 720px and below) the background is suppressed, and the display is responsive to screens widths right down to 240px wide.

To achieve that you need to use media-specific style sheets, or media queries. I would suggest that, to gain a deeper understanding of how the page is built and animated, you might wish to download the source files (Ctrl S) and study them.

If I want scrolling effects with fixed navigation, is it possible to do it by using css only and using fixed width layout? Means no need responsive. I have done several trial using fullPage js plugin, its okay. but when i add an image slider (responsive slider), it ruins. the height not fit overall windows. So is it possible to used fixed width/height layout? And add scrolling effects by not using jquery? What the simplest solution?

Writing the site fixed width will simplify it, but is that the objective? Ten years ago it would not have mattered, but if you want to learn how to build a site to meet modern requirements, it has to be responsive.

Anyway, I'm confused by your reference to a "slider" as the site you mention does full page fade-in/fade-out, not slide in and out. Neither can be achieved with just html/css, but full screen fade-in/fade-out can be written quite easily in JavaScript, using the opacity settings in css3.

Use firebug or google chrome dev tools to find out where your button is when you set it with an absolute position. If the container has position:relative; on it then the absolutely position button will take it's starting position from the container.

okay. then how to make a button float on top of slideshow, i have put the position absolute n z index, but not working. if i put position fixed, it work.

Position absolute takes a little getting used to. Off the top of my head I can think of two reasons why this might go wrong:
1. You have not set the z-index?
2. The container (body or parent div) is not set to position absolute? You have to be consistent and use position absolute for all the divs (and body). It is a completely different way of positioning content.
3. Fixed will work because it positions relative to the screen or window. But it does not scroll with the content. That is rarely useful.

2. The container (body or parent div) is not set to position absolute? You have to be consistent and use position absolute for all the divs (and body). It is a completely different way of positioning content.

You can use position relative on a container then position absolute on an element inside the container. The position absolute will then take it's position from the top left of the container as opposed to the top left of the browser window.

i have set the z-index, and position absolute. but not working. my slideshow(using responsive slider) is position relative. then i put an arrow (link) on top of the slideshow that link to the second page, using anchor. but the arrow not showing. does anyone have sample code? or anything that related with one page website with full width slider and full width fixed navbar that responsive?

You can use position relative on a container then position absolute on an element inside the container. The position absolute will then take it's position from the top left of the container as opposed to the top left of the browser window.

Agreed, I was simplifying. I do not find position relative to be useful.

In the example you have mentioned i didnt like one thing only which is the background, dark green and covering whole website rest the website is very good, for another example check this http://wistech.biz/.