Full screen responsive horizontal website
up vote
3
down vote
favorite
I am trying to find the best method in order to create a horizontal website, full screen and if possible responsive, minimum width to be for tablets. The thing is that I need also the horizontal scrolling with the mousewheel, and I saw that fullPage.js doesn't support that or at least i couldn't manage to make it work on this plugin.
Anyway, I need an idea on building the template, with full screen sections displayed inline - I will be very grateful for any tip. Thanks.
fullscreen horizontal-scrolling fullpage.js
edited Apr 21 '15 at 11:13
Alvaro
26.8k1597231
asked Dec 21 '13 at 8:56
ilonashu
3623
add a comment |
up vote
3
down vote
favorite
I am trying to find the best method in order to create a horizontal website, full screen and if possible responsive, minimum width to be for tablets. The thing is that I need also the horizontal scrolling with the mousewheel, and I saw that fullPage.js doesn't support that or at least i couldn't manage to make it work on this plugin.
Anyway, I need an idea on building the template, with full screen sections displayed inline - I will be very grateful for any tip. Thanks.
fullscreen horizontal-scrolling fullpage.js
edited Apr 21 '15 at 11:13
Alvaro
26.8k1597231
asked Dec 21 '13 at 8:56
ilonashu
3623
1
the fullPage.js and this one minimit.com/articles/code-tips/… but i had trouble in making them to be horizontal- i didn;t figure it out - and all kind of tries in my original css which is not full screen - here is a draft of it jsfiddle.net/E8G9n also i need to mention that i have images as background for each section, a different one- thanks
– ilonashu
Dec 21 '13 at 9:18
add a comment |
up vote
3
down vote
favorite
up vote
3
down vote
favorite
I am trying to find the best method in order to create a horizontal website, full screen and if possible responsive, minimum width to be for tablets. The thing is that I need also the horizontal scrolling with the mousewheel, and I saw that fullPage.js doesn't support that or at least i couldn't manage to make it work on this plugin.
Anyway, I need an idea on building the template, with full screen sections displayed inline - I will be very grateful for any tip. Thanks.
fullscreen horizontal-scrolling fullpage.js
edited Apr 21 '15 at 11:13
Alvaro
26.8k1597231
asked Dec 21 '13 at 8:56
ilonashu
3623
I am trying to find the best method in order to create a horizontal website, full screen and if possible responsive, minimum width to be for tablets. The thing is that I need also the horizontal scrolling with the mousewheel, and I saw that fullPage.js doesn't support that or at least i couldn't manage to make it work on this plugin.
Anyway, I need an idea on building the template, with full screen sections displayed inline - I will be very grateful for any tip. Thanks.
fullscreen horizontal-scrolling fullpage.js
fullscreen horizontal-scrolling fullpage.js
edited Apr 21 '15 at 11:13
Alvaro
26.8k1597231
asked Dec 21 '13 at 8:56
ilonashu
3623
edited Apr 21 '15 at 11:13
Alvaro
26.8k1597231
asked Dec 21 '13 at 8:56
ilonashu
3623
edited Apr 21 '15 at 11:13
Alvaro
26.8k1597231
edited Apr 21 '15 at 11:13
Alvaro
26.8k1597231
edited Apr 21 '15 at 11:13
Alvaro
26.8k1597231
26.8k1597231
asked Dec 21 '13 at 8:56
ilonashu
3623
asked Dec 21 '13 at 8:56
ilonashu
3623
asked Dec 21 '13 at 8:56
ilonashu
3623
3623
1
the fullPage.js and this one minimit.com/articles/code-tips/… but i had trouble in making them to be horizontal- i didn;t figure it out - and all kind of tries in my original css which is not full screen - here is a draft of it jsfiddle.net/E8G9n also i need to mention that i have images as background for each section, a different one- thanks
– ilonashu
Dec 21 '13 at 9:18
add a comment |
1
the fullPage.js and this one minimit.com/articles/code-tips/… but i had trouble in making them to be horizontal- i didn;t figure it out - and all kind of tries in my original css which is not full screen - here is a draft of it jsfiddle.net/E8G9n also i need to mention that i have images as background for each section, a different one- thanks
– ilonashu
Dec 21 '13 at 9:18
1
1
the fullPage.js and this one minimit.com/articles/code-tips/… but i had trouble in making them to be horizontal- i didn;t figure it out - and all kind of tries in my original css which is not full screen - here is a draft of it jsfiddle.net/E8G9n also i need to mention that i have images as background for each section, a different one- thanks
– ilonashu
Dec 21 '13 at 9:18
the fullPage.js and this one minimit.com/articles/code-tips/… but i had trouble in making them to be horizontal- i didn;t figure it out - and all kind of tries in my original css which is not full screen - here is a draft of it jsfiddle.net/E8G9n also i need to mention that i have images as background for each section, a different one- thanks
– ilonashu
Dec 21 '13 at 9:18
add a comment |
2 Answers
2
active
oldest
votes
up vote
0
down vote
you could use one of the tools listed in the following links
http://www.cssdesignawards.com/articles/15-excellent-jquery-plugins-to-spice-up-your-sites/44/
http://jquery-plugins.net/scrollit-js-jquery-plugin-for-scrolling-pages
or you could also mix raw js/jquery with anchor links and add animations when clicked. in taht case you can scroll down using mouse wheel and also have fancy animations when a link is clicked
regarding responsiveness use css media queries
answered Dec 21 '13 at 9:05
lanlau
1067
Hello, for horizontal scrolling i have already make this work - css-tricks.com/snippets/jquery/horz-scroll-with-mouse-wheel just that, the main problem is to make the horizontal website with fullscreen images as background, and responsive - and to be continous, like when scrolling with the horizontal scroll bar-
– ilonashu
Dec 21 '13 at 9:39
add a comment |
up vote
0
down vote
Making horizontally responsive is bit tricky and requires a lot of effort.. There can be many many design approaches for making it responsive. It can't just be described with JSFiddle snippets..
However, I have something for you that will definitely get you started with "Horizontal Responsive Layout designing"..
This is must guide / tutorial for people who want to get started with Horizontal Responsive approach
http://tympanus.net/codrops/2012/04/02/responsive-horizontal-layout/
answered Dec 21 '13 at 9:10
Rahul Patil
4,16732551
Hello, thank you, I am alreday aware of it - i will continue with my searching and tries, it has to be done somehow :)
– ilonashu
Dec 21 '13 at 9:34
add a comment |
2 Answers
2
active
oldest
votes
2 Answers
2
active
oldest
votes
active
oldest
votes
active
oldest
votes
up vote
0
down vote
you could use one of the tools listed in the following links
http://www.cssdesignawards.com/articles/15-excellent-jquery-plugins-to-spice-up-your-sites/44/
http://jquery-plugins.net/scrollit-js-jquery-plugin-for-scrolling-pages
or you could also mix raw js/jquery with anchor links and add animations when clicked. in taht case you can scroll down using mouse wheel and also have fancy animations when a link is clicked
regarding responsiveness use css media queries
answered Dec 21 '13 at 9:05
lanlau
1067
Hello, for horizontal scrolling i have already make this work - css-tricks.com/snippets/jquery/horz-scroll-with-mouse-wheel just that, the main problem is to make the horizontal website with fullscreen images as background, and responsive - and to be continous, like when scrolling with the horizontal scroll bar-
– ilonashu
Dec 21 '13 at 9:39
add a comment |
up vote
0
down vote
you could use one of the tools listed in the following links
http://www.cssdesignawards.com/articles/15-excellent-jquery-plugins-to-spice-up-your-sites/44/
http://jquery-plugins.net/scrollit-js-jquery-plugin-for-scrolling-pages
or you could also mix raw js/jquery with anchor links and add animations when clicked. in taht case you can scroll down using mouse wheel and also have fancy animations when a link is clicked
regarding responsiveness use css media queries
answered Dec 21 '13 at 9:05
lanlau
1067
Hello, for horizontal scrolling i have already make this work - css-tricks.com/snippets/jquery/horz-scroll-with-mouse-wheel just that, the main problem is to make the horizontal website with fullscreen images as background, and responsive - and to be continous, like when scrolling with the horizontal scroll bar-
– ilonashu
Dec 21 '13 at 9:39
add a comment |
up vote
0
down vote
up vote
0
down vote
you could use one of the tools listed in the following links
http://www.cssdesignawards.com/articles/15-excellent-jquery-plugins-to-spice-up-your-sites/44/
http://jquery-plugins.net/scrollit-js-jquery-plugin-for-scrolling-pages
or you could also mix raw js/jquery with anchor links and add animations when clicked. in taht case you can scroll down using mouse wheel and also have fancy animations when a link is clicked
regarding responsiveness use css media queries
answered Dec 21 '13 at 9:05
lanlau
1067
you could use one of the tools listed in the following links
http://www.cssdesignawards.com/articles/15-excellent-jquery-plugins-to-spice-up-your-sites/44/
http://jquery-plugins.net/scrollit-js-jquery-plugin-for-scrolling-pages
or you could also mix raw js/jquery with anchor links and add animations when clicked. in taht case you can scroll down using mouse wheel and also have fancy animations when a link is clicked
regarding responsiveness use css media queries
answered Dec 21 '13 at 9:05
lanlau
1067
answered Dec 21 '13 at 9:05
lanlau
1067
answered Dec 21 '13 at 9:05
lanlau
1067
answered Dec 21 '13 at 9:05
lanlau
1067
1067
Hello, for horizontal scrolling i have already make this work - css-tricks.com/snippets/jquery/horz-scroll-with-mouse-wheel just that, the main problem is to make the horizontal website with fullscreen images as background, and responsive - and to be continous, like when scrolling with the horizontal scroll bar-
– ilonashu
Dec 21 '13 at 9:39
add a comment |
Hello, for horizontal scrolling i have already make this work - css-tricks.com/snippets/jquery/horz-scroll-with-mouse-wheel just that, the main problem is to make the horizontal website with fullscreen images as background, and responsive - and to be continous, like when scrolling with the horizontal scroll bar-
– ilonashu
Dec 21 '13 at 9:39
Hello, for horizontal scrolling i have already make this work - css-tricks.com/snippets/jquery/horz-scroll-with-mouse-wheel just that, the main problem is to make the horizontal website with fullscreen images as background, and responsive - and to be continous, like when scrolling with the horizontal scroll bar-
– ilonashu
Dec 21 '13 at 9:39
Hello, for horizontal scrolling i have already make this work - css-tricks.com/snippets/jquery/horz-scroll-with-mouse-wheel just that, the main problem is to make the horizontal website with fullscreen images as background, and responsive - and to be continous, like when scrolling with the horizontal scroll bar-
– ilonashu
Dec 21 '13 at 9:39
add a comment |
up vote
0
down vote
Making horizontally responsive is bit tricky and requires a lot of effort.. There can be many many design approaches for making it responsive. It can't just be described with JSFiddle snippets..
However, I have something for you that will definitely get you started with "Horizontal Responsive Layout designing"..
This is must guide / tutorial for people who want to get started with Horizontal Responsive approach
http://tympanus.net/codrops/2012/04/02/responsive-horizontal-layout/
answered Dec 21 '13 at 9:10
Rahul Patil
4,16732551
Hello, thank you, I am alreday aware of it - i will continue with my searching and tries, it has to be done somehow :)
– ilonashu
Dec 21 '13 at 9:34
add a comment |
up vote
0
down vote
Making horizontally responsive is bit tricky and requires a lot of effort.. There can be many many design approaches for making it responsive. It can't just be described with JSFiddle snippets..
However, I have something for you that will definitely get you started with "Horizontal Responsive Layout designing"..
This is must guide / tutorial for people who want to get started with Horizontal Responsive approach
http://tympanus.net/codrops/2012/04/02/responsive-horizontal-layout/
answered Dec 21 '13 at 9:10
Rahul Patil
4,16732551
Hello, thank you, I am alreday aware of it - i will continue with my searching and tries, it has to be done somehow :)
– ilonashu
Dec 21 '13 at 9:34
add a comment |
up vote
0
down vote
up vote
0
down vote
Making horizontally responsive is bit tricky and requires a lot of effort.. There can be many many design approaches for making it responsive. It can't just be described with JSFiddle snippets..
However, I have something for you that will definitely get you started with "Horizontal Responsive Layout designing"..
This is must guide / tutorial for people who want to get started with Horizontal Responsive approach
http://tympanus.net/codrops/2012/04/02/responsive-horizontal-layout/
answered Dec 21 '13 at 9:10
Rahul Patil
4,16732551
Making horizontally responsive is bit tricky and requires a lot of effort.. There can be many many design approaches for making it responsive. It can't just be described with JSFiddle snippets..
However, I have something for you that will definitely get you started with "Horizontal Responsive Layout designing"..
This is must guide / tutorial for people who want to get started with Horizontal Responsive approach
http://tympanus.net/codrops/2012/04/02/responsive-horizontal-layout/
answered Dec 21 '13 at 9:10
Rahul Patil
4,16732551
answered Dec 21 '13 at 9:10
Rahul Patil
4,16732551
answered Dec 21 '13 at 9:10
Rahul Patil
4,16732551
answered Dec 21 '13 at 9:10
Rahul Patil
4,16732551
4,16732551
Hello, thank you, I am alreday aware of it - i will continue with my searching and tries, it has to be done somehow :)
– ilonashu
Dec 21 '13 at 9:34
add a comment |
Hello, thank you, I am alreday aware of it - i will continue with my searching and tries, it has to be done somehow :)
– ilonashu
Dec 21 '13 at 9:34
Hello, thank you, I am alreday aware of it - i will continue with my searching and tries, it has to be done somehow :)
– ilonashu
Dec 21 '13 at 9:34
Hello, thank you, I am alreday aware of it - i will continue with my searching and tries, it has to be done somehow :)
– ilonashu
Dec 21 '13 at 9:34
add a comment |
Thanks for contributing an answer to Stack Overflow!
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Some of your past answers have not been well-received, and you're in danger of being blocked from answering.
Please pay close attention to the following guidance:
- Please be sure to answer the question. Provide details and share your research!
But avoid …
- Asking for help, clarification, or responding to other answers.
- Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f20717279%2ffull-screen-responsive-horizontal-website%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
1
the fullPage.js and this one minimit.com/articles/code-tips/… but i had trouble in making them to be horizontal- i didn;t figure it out - and all kind of tries in my original css which is not full screen - here is a draft of it jsfiddle.net/E8G9n also i need to mention that i have images as background for each section, a different one- thanks
– ilonashu
Dec 21 '13 at 9:18