Jump to content


Photo
- - - - -

Parallax Full width Section problem, lower part picture showing on top

parallax Full Width section pagelines dms picture

Best Answer Danny , 05 January 2014 - 01:03 PM

Just to update you all on this, the issue has now been resolved by our developers and will part of the 1.2 update.

Go to the full post


  • Please log in to reply
47 replies to this topic

#21 Mark & Phil

Mark & Phil

    Advanced Member

  • Members

  • 69 posts
  • LocationPoughkeepsie, NY
  • Framework Version:1.1.1
  • Country: Country Flag

Posted 08 December 2013 - 02:19 PM

Just so everyone knows of an alternative, we had attempted to use depth charge as well but it didn't make the images show how we wanted and was having some weird loading issues for us. We ended up using the basic Stellar JS parallax script. Info at http://markdalgleish...cts/stellar.js/


  • Erwan likes this

#22 seventhsite

seventhsite

    Member

  • Members

  • 28 posts
  • Country: Country Flag

Posted 09 December 2013 - 03:47 PM

same problem... even if the height is 50 px and the photo is 700 px tall... the top 25 px is the bottom of the picture, and the bottom 25px is the top of the picture.  :( 



#23 Erwan

Erwan

    Super Member

  • Members

  • 193 posts
  • Framework Version:Framework 2.4.4 - DMS 1.1.6 & 1.2
  • Country: Country Flag

Posted 21 December 2013 - 08:53 AM

@Mark & Phil What are the exact image showing + loading issues you encountered with DepthCharge ? Did you contact @etcio (developer)?



#24 Mark & Phil

Mark & Phil

    Advanced Member

  • Members

  • 69 posts
  • LocationPoughkeepsie, NY
  • Framework Version:1.1.1
  • Country: Country Flag

Posted 27 December 2013 - 07:26 AM

@Erwan I can't recall what they were, that was 3 projects ago (about a month and a half ago). When we encounter issues again we'll be sure to document them.



#25 agent654l

agent654l

    Member

  • Members

  • 14 posts
  • LocationTampa, FL
  • Country: Country Flag

Posted 03 January 2014 - 10:58 PM

I actually added -25px margin-top to LESS CSS and designated local class for page I was using parallax for and seems to be a quick fix :thumbsu:


  • jennajonesdesign likes this

#26 Danny

Danny

    Is Awesome!

  • Moderators
  • 16392 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 05 January 2014 - 01:03 PM   Best Answer

Just to update you all on this, the issue has now been resolved by our developers and will part of the 1.2 update.



#27 etcio

etcio

    Advanced Member

  • Members


  • 68 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 05 January 2014 - 05:45 PM

Awesome, @Danny, thanks for that. Do you have the link to the commit by chance?



#28 Danny

Danny

    Is Awesome!

  • Moderators
  • 16392 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 05 January 2014 - 05:46 PM

I think the 1.2 branch is set to private so you probably wont be able to see it.

 

https://github.com/p...02eca2394f79aa9



#29 etcio

etcio

    Advanced Member

  • Members


  • 68 posts
  • Framework Version:DMS
  • Country: Country Flag

Posted 05 January 2014 - 05:48 PM

I think the 1.2 branch is set to private so you probably wont be able to see it.

 

https://github.com/p...02eca2394f79aa9

 

I can see it. He's dynamically setting the offset. Glad it's resolved - thanks!



#30 Danny

Danny

    Is Awesome!

  • Moderators
  • 16392 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 05 January 2014 - 05:49 PM

Cool!



#31 janpeeters

janpeeters

    Advocate

  • Members

  • 307 posts
  • LocationBreda, The Netherlands
  • Country: Country Flag

Posted 19 February 2014 - 07:15 PM

Hi @Danny,

 

I copied the 1.2 code to the current release version of DMS on this site http://www.panassembla.com.

The bottom part is indeed not visible anymore at the top of the section area. As far as I can tell from the line of code that I copied the image is now positioned at 0. I think this might cause a slight problem when your pulling up too much. Because of the bounciness of the parallax effect you will then still start seeing the bottom part of image. So to provide for proper elasticity I would suggest setting the offset to something like -10px (or as much as you can 'bounce'). Or make it user definable.

 

I'm hoping I'm clear enough ;-)

 

Best, Jan



#32 Danny

Danny

    Is Awesome!

  • Moderators
  • 16392 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 20 February 2014 - 11:33 AM

Hi Jan,

 

You're going to need to add another section to that area, at the moment there isn't enough height/content to increase the height of the area you have the parallax on.



#33 janpeeters

janpeeters

    Advocate

  • Members

  • 307 posts
  • LocationBreda, The Netherlands
  • Country: Country Flag

Posted 20 February 2014 - 11:53 AM

Ah okay Danny, good to know that that can solve it. Thanks!



#34 Danny

Danny

    Is Awesome!

  • Moderators
  • 16392 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 20 February 2014 - 12:00 PM

Did you check, as thats what I got from looking at it, what I did was copy the code for that Slabber Text section and then added it again underneath the Slabber Text section, so I had two of them, thus increasing the area size which displayed more of the image.



#35 janpeeters

janpeeters

    Advocate

  • Members

  • 307 posts
  • LocationBreda, The Netherlands
  • Country: Country Flag

Posted 20 February 2014 - 12:05 PM

Hi Danny, No I did not check it yet. But what I just noticed is that it only happens in Chrome that you see the bottom of the image at the top. This has to do with the fact that Chrome has this top of page bounciness where you see a bit of canvas. When that happens the image reveals part of the bottom. With Firefox, top of page is top of page so the image just stays at position 0 instead of revealing -10px. Curious if you can reproduce this. So my problem is not that I need to have more image visible.



#36 Danny

Danny

    Is Awesome!

  • Moderators
  • 16392 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 20 February 2014 - 12:08 PM

Oh hang on, are you referring to Chrome revealing the bottom of the image when you use the fast scroll up, which gives you the elastic effect ?

If so, I don't really see that as a problem to be honest. However, I can report it for you.



#37 janpeeters

janpeeters

    Advocate

  • Members

  • 307 posts
  • LocationBreda, The Netherlands
  • Country: Country Flag

Posted 20 February 2014 - 12:17 PM

Here it is ;-)

http://www.panassembla.com/et6ygdsuy6
 



#38 Danny

Danny

    Is Awesome!

  • Moderators
  • 16392 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 20 February 2014 - 12:29 PM

Yeah, I don't think that is an issue, well for me anyway. However, I will bring it to our developers attention and see what they say.

 

Can you keep that page, active as I will use it for a demonstration.



#39 janpeeters

janpeeters

    Advocate

  • Members

  • 307 posts
  • LocationBreda, The Netherlands
  • Country: Country Flag

Posted 20 February 2014 - 01:21 PM

Hi Danny,

 

I agree, maybe not really an issue,but with everything going 'touch' and elastic it could aesthetically be a small nuisance. If you know how to offset the background via CSS it would be great if you posted it. I've not been able to get a CSS correction working with parallax. Maybe because it's js.

 

Thanks, Jan



#40 Danny

Danny

    Is Awesome!

  • Moderators
  • 16392 posts
  • LocationManchester, UK
  • Country: Country Flag

Posted 20 February 2014 - 02:01 PM

I've already reported to our developers, if I hear anything I'll reply here.







Also tagged with one or more of these keywords: parallax, Full Width section, pagelines, dms, picture