Home > front end >  For Mazda's official website this effect is how to implement many thanks bosses
For Mazda's official website this effect is how to implement many thanks bosses

Time:09-16

http://cx-4.faw-mazda.com

Bosses I want to ask the Mazda's official website of this effect is how to realize I download the source code is not good make the effect won't have to be like this in the middle of the drag

CodePudding user response:

This is 2 pictures, one at the bottom of the mask, drag is the mask of change, is a control shows how much width

CodePudding user response:

reference 1st floor front _ rookie response:
this is 2 pictures, one at the bottom of the mask, drag is the mask of change, is a control shows just how much width

Is very doubt my mask can't drag??

CodePudding user response:

Three elements, two overlapping div, a div can operate,
Two elements, overlap fixed, set different background, the div above we call him,
Operability div, we call him back fuck,
Then set in hold on moving to the right,
HTML set down said js

Add an event to fuck onm ousedown, content to e=& gt; {}, in the action, e have a property called pageX, said horizontal position when click the mouse,

Then the action of this operation and add a onm ousemove events, event body is the window or the document can be, action content for x=& gt; {}, the x also has a attribute pageX, said the level of the current mouse position

Ok, we got fucked from click to mobile fuck two horizontal position, and then calculate the two of them is poor, through this difference to change the width of the,

Call it a day ~ ~ ~ ~

CodePudding user response:

reference 2 floor Xjx. Response:
Quote: refer to 1st floor front _ rookie response:
this is 2 pictures, one at the bottom of the mask, drag is the mask of change, is a control shows just how much width

Is very doubt my mask can't drag?

Code is not necessarily can crawl others, because some things is not complete, so still want to change, you can go to see the mouse moves the mouse events, you will look search API

CodePudding user response:

The sliding js source here
https://wwwcdn.faw-mazda.com/cx4/fer/fan/cx4.js? Bust=1592817859857, open it, and then search "cx4_03c_after"
  • Related