Discussion on SCRN - One Page Responsive Parallax Template

Discussion on SCRN - One Page Responsive Parallax Template

Cart 2,986 sales
Well Documented

clientica supports this item

Supported

This author's response time can be up to 1 business day.

284 comments found.

Great template! easy code to follow, simply love it.

Just one question. The hight of the “section” images. The images I wish to use are not as high as the images in your framework. What is the best way to handle this? Where can I sent a lower height so that I don’t see image repeat in these sections?

Hi,

You can easily change the height in the layout.css file. Find these selectors: #separator1, #separator2 and #separator3. And change the height property.

Hi,

I can see that I can change the size of the separator itself, default it is set to 500px, but it is the image behind it. For example, the images I am using within the separator all of a hight of 792px. On some screens it looks OK but on most you can see the image repeat both across x and y. Not sure how to stop that.

Hope that makes sense…

C.

Hi,

You have to play with some values on the nbw-parallax.js file. Go to lines 71, 79, 87 and 96 and you’ll find this line: bg1.css({‘backgroundPosition’: newPos(50, windowHeight, pos, 400, 0.2)}); the value 400 is the vertical position, try playing with these values.

Hello,

I would like to apply this template to several html files in a website.

I was wondering if was possible to have a main menu for changing html files, and then a secondary menu to navigate in the same page.

Is possible to add to this template a secondary menu?

Thank you!!!

Hi,

Yes, I guess that is possible. Is just a matter of editing the code.

Hello,

The downloaded version of SCRN includes the following style on line 722 of layout.css, inside the max-width: 1024px @media query:

#intro .bg1 {
    background-size: 120%;
}

This style seems to be absent from your demo, and causes the #intro background image to repeat in non-desktop breakpoints – on my downloaded version.

Is it the demo or my download that is out of date? Can you explain why you’re forcing the background-size to 120% in the @media query rather than just applying background-size: cover throughout?

Other than this little glitch, I think this is a fantastic template. Thank you for all your hard work on it!

Hi,

The demo is out of date, I will update it soon. About the background-size, you’re right, I should have used background-size: cover.

I’m having issues with the descriptions of portfolio items. In some cases, it is four lines. In other cases, it is three lines. With the inconsistency, the layout is a bit off. Am I missing something?

Thanks.

Hi, what version are you using? HTML or WordPress?

Re: my above message – I see it’s a js thing. If I wanted to add a source from a certain website, is there an easy way to do that? The videos can be embedded. I don’t have much experience with js. Cheers Deats

Hi – no, I don’t have access to the swf file. If I email you the website I want to embed videos from is that something you could look at? Or give me a steer on how to do it myself?

Also, I’ve uploaded a version I am working on to my site – and am getting a lot of flicker on the background images when they scroll. I see this was a bug a little while ago – but thought it would be fixed in the version I have. Is it just to do with their relative position? How do I fix that? cheers Deats

Ok, send me an email with the website. About the flicker, I will replace the slider with another one, that should fix it.

Great – thanks so much. Sending you stuff now. DTS

Hi Rodbor

Will the template support other video than Vimeo and YouTube? I am trying to embed videos from another site into the Work section, but I get an error message telling me the preview image can’t be found (although I am not actually changing the image file, but the Vimeo url it points to) ...

Any idea why that is?

Cheers Deats

Hey,

I can’t get it work to highlight the current scrolling position. Do you have an idea?

Here is an example: http://www.htmldrive.net/items/demo_show/1094#section-2

Best regards, Alex

Hello,

That is a different javascript plugin, I guess it’s possible to implement it, but it would requires some javascript knowledge in order to make the behaviour similar to the one used by SCRN.

I may try adding something similar in the next update.

Sorry. It formatted my code. Here’s how it looks in email:

New message sent from your website: April 11th, 2013, 10:47 My Contact Form Form URL: http://endymionstudio.com/ -------------------------------------------------------------- <p>Name</p>: Testy Testerson <p>Email Address</p>: testing@test.com <p>Message</p>: This message is for testing purposes. --------------------------------------------------------------

What email client are using? It seems it doesn’t support HTML.

Thanks for the info on the update for the flickering scenario and the other. This is what I’m getting as form submission:

New message sent from your website: April 11th, 2013, 10:47

My Contact Form

Form URL: http://endymionstudio.com/ -----------—-

Name

: Testy Testerson

Email Address

: testing@test.com

Message

: This message is for testing purposes.

I attempted to move the

tags in the index page code, but it wipes-out the formatting on the display of the form labels. Attempted to find a fix, but no success. It’s obviously not a major dilemma, but if there was an easy fix, I’d love to hear it.

Thanks for the quick response.

Awesome template!

I’m wanted to add a little more parallax effect to the site – something like what is seen here: https://www.spotify.com/us/. I want the images to slow at a slower pace than the content. Any ideas/tutorials? Is this an easy concept to implement?

Thanks!

Hello,

Yes it’s easy, you just need to change a value in a JS file.

Mind pointing out where to make the change? Which JS file and which line should I change? Thanks!

I will gladly help you when you purchase the template.

Great template. I have two issues with which I’m hoping you can help…

1) When I receive the email from the contact form, it contains

tags in the info. I’ve attempted to move the tags outside of the tags, but then the formatting is off. Any suggestions for cleaning this up?

2) My site flickers on iPhone, and seems to be timed with the flexslider. I’ve spent a long time working on the code, but can’t seem to solve it. Would appreciate any insight.

3) Also on iPhone, intro page repeats, rather than filling the frame.

My test site is here: endymionstudio.com.

It’s important to note that PrettyPhoto didn’t work right on iPhone, so I went with FancyBox. Don’t know if any code is conflicting, so would appreciate any help.

Hello,

1) What kind of tags?

2) This will be fixed in the next update, I’m finishing something and then I’ll work on thois.

3) Go to layout.css and in the media queries you’ll find this: #intro .bg1 { background-size: 120%; }

You can remove or tweak this.

Hi! I’m checking lots of Parallax based Themes here, and the Menu doesn’t work in mostly of the themes. When you click on a button, the page simply does not scrolls down to the referent content.

Hi,

I can confirm the menu correctly is working in all the browsers.

Hey there im pretty new here, ive got some (beginner stupid) questions regarding this template.

1- im currently using cargo collective for my website, is it possible to embed the code in there?

2- can i easily add more projects in the work section?

3- is it possible to add videos in the projects of the work section?

thanks alot and btw i love this template and all othere ones too, really awesome job. m_r

Hello,

1 – I never used cargo collective, so I really don’t know.

2 – Yes you can.

3 – Yes it is.

I am curious. I would like to have the Home page be Parallax but the rest of the site be my current Theme – MySiteMyWay – Dejavu. Is it possible to: > Use this theme as the home landing page but the balance of the site as my current > Tie in my current site navigation into the parallax navigation > Sections of the parallax >> Can it support videos that are stored elsewhere other than YouTube >> Support scrollers other than the one shown > Are the codes notes logical, clean & notated <!- Comment ->

I appreciate your time in answering these and elaborating. We work with nonprofits and would like to include parallax in our offering. This one seems to have a business like application while other are to 1-page only designerish Thank You Joe JOhnson jjohnson@ddafnonprofit.com

Hi, I answered you via email.

Hi Rodbor, I´ve been using and tweaking the template to suit my needs, everything works great, but I need to put a link either in a photo or the title text inside the prettyPhoto gallery but I can´t make it work properly. Do you know a way to doing so?

Thanks in advance

Hi,

add this inside the <a href=""></a> tag:

http://justpaste.it/2cfa

Hi thanks for the tip I needed a little more tweaking but manage to make it work correctly

Best regards

Hello. What I need to change (and where) to a bg2 and bg3 no horizontal gluing? U can see it http://new.ecoflops.ru Thanks!

Hi,

What do you mean with horizontal gluing?

Hi, I bought the template and I have been customizing it this week and it is great.

I’m just having a hard time adding content using inside the photographs section. I can only add an image at this time.

Can you tell me how?

In future releases it would be great to have one of those section not just presenting a simple sentence but content similar to the “Team” or “Contact” section for example.

Hi, sorry for my late response.

In the next version you will be able to add content to the portfolio items. I expect to release it this month.

I meant content inside the “seperators” where you have a picture with only a text sentence on top currently. I would like to add content inside “div” inside those areas.

I also still have the bug where your unmodified theme and my version have the pictures in the intro repeat vertically (tiling) in reduce width inside browser and ipad, iphone. It happens locally and on 2 different test servers.

After close to 20k in sale I hope this issue can be resolved. See I want to buy the theme for other clients once I know what is wrong.

Hi,

1 – Yes you can add any content inside those areas, just assign those divs position: relative; and a z-index higher than the backgrounds.

2 – I’m trying to replicate this issue and come with a fix.

Also I read that there were problems with the contact form, was that only in the wordpress version? or also in html? Just to make sure I get all the emails… I have the version from oct 2012.

If your contact form works you don’t need to do anything. The older contact form was not working correctly on some hosts.

Hello rodbor,

I added an additional separator (separator4). It worked out quite well, except for the special effect (that the picture moves) the other separators have…

I added in nbw-parralax.js

//apply the class “inview” to a section that is in the viewport $(’#intro, #separator 4, #separator1, #separator2, #separator3’).bind(‘inview’, function (event, visible) {

and

//if the new section is in view… if($newBG.hasClass(“inview”)){ //call the newPos function and change the background position $newBG.css({‘backgroundPosition’: newPos(0, windowHeight, pos, 850, 0)}); //$secondBG.css({‘backgroundPosition’: newPos(50, windowHeight, pos, 1550, 0.3)}); bg5.css({‘backgroundPosition’: newPos(50, windowHeight, pos, 1000, 0.2)}); //call the newPos function and change the second background position

and in layout.css

} #separator4 { width: 100%; height: 500px; position: relative; }

separator4 .bg5 {

background: url(../images/bg5.jpg) repeat 0 0 fixed; margin: 0 auto; padding: 0; position: absolute; z-index: 200; width: 100%; height: 500px; }

is there anything else I have to change? Thanks

Hi, sorry for my late response.

If you send me your files I can do it for you. (info@rodrigob.com)

Hey there, just bought your template and its working just fine… there’s only one thing that’s different to your life preview:

When I change nothing on your template: The pictures in the intro and the second seperator repeat vertically (in small browers (like on a smartphone or just a very small browser window))... The first and third seperators are working just fine… Can’t find any difference between them in the index.html…

I tried changing some settings in the nbw-parallax.js, which only changed the position of the background jpg in the normal sized browser window…

Someone already asked that question and you answered that a bigger pictures should work out.. It doesn’t… . I changed the jpg size a few times… Again: You can see a difference in a normal sized browser window, but not in the small ones….

Please help me out!! Thanks again…

Hello,

Can you send me your files so I can take a look? info@rodrigob.com

by
by
by
by
by
by

Tell us what you think!

We'd like to ask you a few questions to help improve ThemeForest.

Sure, take me to the survey