Parallax Help

[fadia77241875]

Hello all;

I found this website showing mouse-over effect written in J Query.

jQuery Mouseover Effect with Parallax Style Tutorial - freshDesignweb

I don't know where to start, how do I design an image in a way that the scripts are able to move those parts in the image independently in different direction as you move the mouse within image boundary?

I also found another demo "see screen shot below", when you move the mouse over an image, the shoe will move closer toward me and the text on the left just moves around as you move the mouse inside the image.

Can you please explain.

Thanks.

[BenPleysier]

I use this extension for Dreamweaver https://www.dmxzone.com/go/32826/app-connect-animate-css/ to get this effect https://pleysier.com.au/klarity/parallax.php

[ALsp]

I'm not sure where they came from, but there are quite a few errors on that page:

Showing results for https://pleysier.com.au/klarity/parallax.php - Nu Html Checker

Here is an alternative approach to complex animations:

BSE Animation Test

[osgood_]

ALsp  wrote

I'm not sure where they came from, but there are quite a few errors on that page:

Showing results for https://pleysier.com.au/klarity/parallax.php - Nu Html Checker

That's something I addressed in this forum a few days ago - most of those errors relate to the front-end js framework that Ben is using as I'm sure you know. It would be the same for Vue and I think React and Angular, although I think Vue does have a way you can make any page with Vue directives validate, but I havent explored that yet.

As you probably also know I was never a great follow of validation and have always expressed that in this forum over a number of years. My 2 pence on the subject of validation is know your own code and why it doesnt validate 100%. The bit that irks me most is people who religiously suggested validation was important now obvioulsy think its not, because they have found 'convienient' workflow which is currently suitable to their needs, go figure.

Similary it was always said the less html used in your page the better and cleaner and more managable, until css frameworks appeared and then the same people that religioulsy followed that line of thought suddenly changed their minds.

You could'nt make this shite up if you tried.

Going back to validation should the W3C be held responsible for NOT keeping up with progress and only allowing the the 'data-' attribute for html elements or have they just given up, considering the amount of new and up-coming frameworks released practically every day.

[ALsp]

I pretty much agree with you on validation, but we have a little twist in this because if we produce a widget for someone who is not a coder and someone points out validation results yielding 100 warnings and errors, as Rickey Riccardo would say, "You got a lot of 'splainin to do, Lucy!.

Of course, the other issue is that browser programmers can opt to ignore certain bits of code that does not meet strict standards, just as they might support stuff thy have business supporting. Our motto is cleanliness of code is next to "goodliness"... within reason 😉

[osgood_]

ALsp  wrote

I pretty much agree with you on validation, but we have a little twist in this because if we produce a widget for someone who is not a coder and someone points out validation results yielding 100 warnings and errors, as Rickey Riccardo would say, "You got a lot of 'splainin to do, Lucy!.

Of course, the other issue is that browser programmers can opt to ignore certain bits of code that does not meet strict standards, just as they might support stuff thy have business supporting. Our motto is cleanliness of code is next to "goodliness"... within reason 😉

I agree, it's an issue and why I bought it up and said in a recent post, 'we' are creating a bloody mess for ourselves at the moment. I don't particlularly like the idea of having to explain to a client why their website doesnt validate if for any reason a 'nosey' competitor points them in the direction of the W3C validation service and that's the only reason why I make an effort to keep my pages as clean as possible.

More needs to be done as we progress, from both parties, the framework developers and the W3C if validation is still to be considered 'relevant' in this day and age.

[pziecina]

osgood_  wrote

Going back to validation should the W3C be held responsible for NOT keeping up with progress and only allowing the the 'data-' attribute for html elements or have they just given up, considering the amount of new and up-coming frameworks released practically every day.

Just to show I am still around, here is my reply -

The W3C working group(s) do discuss frameworks, validation, accessibility, (and other things) but cannot be held responsible for none conformance by developers, or for what they use, and how they use code. The general view if you join one of the groups, is that most sites that ignore the w3c's advice are destined to become primarily 'zombie' sites anyway, unless they are already big names on the web, and have been so for a number of years.

If you look at all frameworks, the companys whos names are associated with them are no longer prominent, or are in decline in importance.

A claim of 40% of sites using a (insert framework name) framework, may sound good, but how the sites have performed is never stated, and to what region, (wordpress and bootstrap, stats are mainly for the USA) does the stats apply).

[osgood_]

pziecina  wrote

osgood_   wrote

Going back to validation should the W3C be held responsible for NOT keeping up with progress and only allowing the the 'data-' attribute for html elements or have they just given up, considering the amount of new and up-coming frameworks released practically every day.

Just to show I am still around, here is my reply -

The W3C working group(s) do discuss frameworks, validation, accessibility, (and other things) but cannot be held responsible for none conformance by developers, or for what they use, and how they use code.

That's really slightly backwards looking in my opinion because development moves at a pace which the W3C seemingly cannot keep up with. You can't ignore a 'new' workflow, one which is significantly recognised within in the industy itself as a 'standard' way of coding a website just because the W3C are sitting twiddling their thumbs. They need to be more flexible in my opinion if validation is to be taken seriously any longer, which in my opinion it's not, since the onslaught of many new workflows, which were'nt around 10 years ago when validation was more relevant and could be controlled. Its a changing platform and I'm afraid to say the W3C are some way behind in terms  of what is acceptable practice in constructing a webpage.

pziecina  wrote

The general view if you join one of the groups, is that most sites that ignore the w3c's advice are destined to become primarily 'zombie' sites anyway, unless they are already big names on the web, and have been so for a number of years.

Yes, we all know about groups who actually do nothing but talk. The W3C validation service is already fast becoming one of those zombie site you mention. Virtually no decent developer ever mentions validation these days, its a throw back to yester-year, mostly pointless and worthless as I've been saying for a least a decade and will continue to decline as more advanced workflows pop up here there and everywhere.

pziecina  wrote

A claim of 40% of sites using a (insert framework name) framework, may sound good, but how the sites have performed is never stated, and to what region, (wordpress and bootstrap, stats are mainly for the USA) does the stats apply).

I worry less about stats these days. Everyone gots an opinion about how well a website is performing. Some poncy (money grabbing thief) company run a check on one of my clients websites the other day and built a report. Yes ok it was useful but the real proof of the pudding is how well was it positioned in Google 'local' search - pretty darn good, above all their competitors in most search phrases, apart from national companies, which you arent going to use if your local to this particular service needed. I disussed the situation with my client, who was naturally worrried, and it was left to me to inform this poncy company to pisssss off.

[pziecina]

The w3c has been playing catch up for the last 15 years, (10 actually because they ignored html5/css3 for the first 5 of those).

I'm just saying that working groups are not really interested in what is happening, (much like most forums, and Dw) because everything changes so often now when compared to 10 years ago. If you look at this forum and others the last 10 years of new features by the w3c may as well have never happened. It takes 5-10 years to get features from authors drafts to working drafts by the w3c, add to that the x-browser implementation problems and its surprising anything ever gets to be a recommended spec.

Validation has gone the same way as accessibility on the web.

[osgood_]

pziecina  wrote

The w3c has been playing catch up for the last 15 years, (10 actually because they ignored html5/css3 for the first 5 of those).

I'm just saying that working groups are not really interested in what is happening, (much like most forums, and Dw) because everything changes so often now when compared to 10 years ago. If you look at this forum and others the last 10 years of new features by the w3c may as well have never happened. It takes 5-10 years to get features from authors drafts to working drafts by the w3c, add to that the x-browser implementation problems and its surprising anything ever gets to be a recommended spec.

Validation has gone the same way as accessibility on the web.

Agreed, its virtually a free-for-all now. The monster has just doubled in size and will continue to grow uncontrollably.

[Nancy OShea]

osgood_  wrote

Some poncy (money grabbing thief) company...

I think you mean Ponzi --  as in  Charles Ponzi who invented the scheme of paying early investors with money collected from later investors.

[osgood_]

No l mean poncy, its a very British saying.

Edited

It might help if l spell it correctly  - poncey

[Nancy OShea]

osgood_  wrote

No l mean poncy, its a very British saying.

Edited

It might help if l spell it correctly  - poncey

Oh, like pompous or pretentious.  I see now.   Thanks for clarifying.

[osgood_]

https://forums.adobe.com/people/Nancy+OShea  wrote

osgood_   wrote

No l mean poncy, its a very British saying.

Edited

It might help if l spell it correctly  - poncey

Oh, like pompous or pretentious.  I see now.   Thanks for clarifying.

Yes, exactly right

[BenPleysier]

ALsp  wrote

I'm not sure where they came from, but there are quite a few errors on that page:

Showing results for https://pleysier.com.au/klarity/parallax.php - Nu Html Checker

Yes, I can see how a gullible person could view this as a problem. More informed persons would have read

This tool is an ongoing experiment in better HTML checking, and its behavior remains subject to change

[BenPleysier]

In case you are confused by ALsp​'s uninformed comment regarding the validation of custom attributes, the following is a quote from the official W3C documentation:

JavaScript libraries may use the custom data attributes, as they are considered to be part of the page on which they are used. Authors of libraries that are reused by many authors are encouraged to include their name in the attribute names, to reduce the risk of clashes. Where it makes sense, library authors are also encouraged to make the exact name used in the attribute names customizable, so that libraries whose authors unknowingly picked the same name can be used on the same page, and so that multiple versions of a particular library can be used on the same page even when those versions are not mutually compatible.

For example, a library called "DoQuery" could use attribute names like data-doquery-range, and a library called "jJo" could use attributes names like data-jjo-range. The jJo library could also provide an API to set which prefix to use (e.g. J.setDataPrefix('j2'), making the attributes have names like data-j2-range).

In other words, attributes like dmx-bs-tooltip="  are perfectly valid and shows DMXzone's forward vision. Perhaps the Nu Html Checker and ALsp should catch up.

[ALsp]

BenPleysier  wrote

In case you are confused by ALsp 's uninformed comment regarding the validation of custom attributes, the following is a quote from the official W3C documentation:

JavaScript libraries may use the custom data attributes, as they are considered to be part of the page on which they are used. Authors of libraries that are reused by many authors are encouraged to include their name in the attribute names, to reduce the risk of clashes. Where it makes sense, library authors are also encouraged to make the exact name used in the attribute names customizable, so that libraries whose authors unknowingly picked the same name can be used on the same page, and so that multiple versions of a particular library can be used on the same page even when those versions are not mutually compatible.

For example, a library called "DoQuery" could use attribute names like data-doquery-range, and a library called "jJo" could use attributes names like data-jjo-range. The jJo library could also provide an API to set which prefix to use (e.g. J.setDataPrefix('j2'), making the attributes have names like data-j2-range).

In other words, attributes like dmx-bs-tooltip="  are perfectly valid and shows DMXzone's forward vision. Perhaps the Nu Html Checker and ALsp  should catch up.

We use data attributes all the time. If you get your head out into the sunshine, instead of taking every opportunity you can to promote your benefactors, you might have noticed. Don't invite a fight you cannot win.

[osgood_]

BenPleysier  wrote

In other words, attributes like dmx-bs-tooltip="  are perfectly valid and shows DMXzone's forward vision. Perhaps the Nu Html Checker and ALsp  should catch up.

Actually they are NOT valid according to the W3C validator, which is awkward to say the least. However I would not worry about it to be honest as validation, beyond a certain point, is a complete and utterly, useless waste of time - I was touting that stand point 10 years ago.

The problem I find is that it adds yet another level of complication and explanation should a client check out their website in the validator. In other words it will always leaves a degree of uncertainly in the mind of the client if they see errors, which of course is NOT desirable.

I persoanlly believe the W3C validation service should be retired UNLESS they get their act together and keep up to date with new workflows which obviously is not possibile now or in the future, so it makes the service highly redundant and a joke in my personal view.

As I said the W3C validation service is in decline and no decent web-developer will give it the light of day or even mention it apart from maybe someone whose still stuck in the 90's way of devloping websites. Remember some used to 'proudly' show a little stupid W3C validation badge at the bottom of the website page - when was the last time you saw one of those dumb assed buttons?

Some bright spark has written a bit of javascript for vue js which means you can if you want make vue valid when checkiing in the W3C validator BUT it means adding yet another file to the page and re-writting the standard vue directives which is a pain in that arse. I shall not be using it otherwise it just adds support to the W3C validation service, which adds to keeping a dinasour alive.

The only addition I would add is -  DMX SHOULD provide an option in which they can pefix their directives with 'data-' so those few that DO consider validation important have the ability to make their code/results valid. I'm sure it would be easy peasy for them to add. The problem is no-one that uses Wappler, or very few, has any idea about coding so it generally goes unnoticed.

[pziecina]

osgood_  wrote

I persoanlly believe the W3C validation service should be retired UNLESS they get their act together and keep up to date with new workflows which obviously is not possibile now or in the future, so it makes the service highly redundant and a joke in my personal view.

...

The problem is no-one that uses Wappler, or very few, has any idea about coding so it generally goes unnoticed.

The problem with validation now, is that unlike xhtml which was all lower-case, html5 is not case sensitive, and can even be written in mixed-case. Add to that the multiple workflows that can, (and are) used by those using frameworks, (or those mixing frameworks) volunteers writting a validator that works becomes an almost impossible task. Maybe if the validator was a paid for tool, (no longer written by volunteers) it would be kept up to date, but then how many would buy it, especially when one reads the posts in this forum about problems that are 'corrected' by validation?

Which brings us to another problem, if Dw and other editors fail with invalid code, then is not the real problem the end user of those products, (designers/developers) and their lack of understanding?

[osgood_]

pziecina  wrote

Maybe if the validator was a paid for tool, (no longer written by volunteers) it would be kept up to date, but then how many would buy it

Probably no one, which is why a third rate, dated service makes it a valid reason for any developer NOT to place any great emphasis on its results. It's alright shouting about this is invalid and that is invalid BUT unless the browers actually stop showing ALL invalid code, according to the W3C's stand point or view, then what is the incentive to actually make anything valid if it works in the browser. That always been the case. If you dont act upon 'threats' then nothing improves.

pziecina  wrote

Which brings us to another problem, if Dw and other editors fail with invalid code, then is not the real problem the end user of those products, (designers/developers) and their lack of understanding?

Not sure if its lack of understanding in a lot of cases. I know Vue doesnt validate, unless I jump through hoops to make it do so. Is that  a reason to stop using it or should it be the responsibilty of the framework developers/editors to work hand in hand with the consortium/browsers to make sure anything they bring to market does validate. else what's the point.

Seems like you peg down one side of the tent only for the other side to work its way lose and fly away.

[pziecina]

osgood_  wrote

Seems like you peg down one side of the tent only for the other side to work its way lose and fly away.

Isn't that life in general .

I don't know if you remember back when xhtml was first implemented in browsers, but many sites that used xhtml initially failed to display in netscape and ie at the time, (there was only those two back then) because the code was invalid. The fix, (if you want to call it that) was to declare the xhtml to be html and only use the dtd declaration for validating elements. Then we had the 2px jog in ie to show that a page was invalid, which many sites 'fixed' by applying a negative top margin.

Seems to me, that in 20 years nothing has changed. Hacks, 'fixes' and ignore the rules is the order of the day.

[osgood_]

pziecina  wrote

I don't know if you remember back when xhtml was first implemented in browsers, but many sites that used xhtml initially failed to display in netscape and ie at the time, (there was only those two back then) because the code was invalid. The fix, (if you want to call it that) was to declare the xhtml to be html and only use the dtd declaration for validating elements. Then we had the 2px jog in ie to show that a page was invalid, which many sites 'fixed' by applying a negative top margin.

No not really - I was a bit green back in those days. I really came into it at around the time of Nutscape 4 and IE5. That's when I really started to take an interest in coding. Before that I just pulled elements around the screen like in a DTP application, from which I came, which of course was destined to end in failure

pziecina  wrote

Seems to me, that in 20 years nothing has changed. Hacks, 'fixes' and ignore the rules is the order of the day.

Seems to be that way, still.

[ALsp]

Maybe if the validator was a paid for tool, (no longer written by volunteers) it would be kept up to date, but then how many would buy it, especially when one reads the posts in this forum about problems that are 'corrected' by validation?

Subtle. But I like it

[osgood_]

ALsp  wrote

Maybe if the validator was a paid for tool, (no longer written by volunteers) it would be kept up to date, but then how many would buy it, especially when one reads the posts in this forum about problems that are 'corrected' by validation?

Subtle. But I like it

Looking at it like that I suppose it does serve a purpose to some degree but creates an even bigger void when little nephew joeys website, built for 200 quid, validates (hardly likely to be using a front-end js framework) and the all singing all dancing one, produce by a top end web-developement company, doesn't .......hummm.

Could be difficult to face down when the client questions you

[ALsp]

<h1 data-sarcasm-max-effect="100%">Absolutely</h1>