I have left and right container. In the right container height 600px. Inside this right container can you show vertical max post items? 3 Items will be show and more items i can see when i scroll down vertically. Is it possible? Thanks
There was some JS code though I've not tested that for a while. function replaceVerticalScrollByHorizontal( event ) { if ( event.deltaY !== 0 ) { window.scroll(window.scrollX + event.deltaY * 2, window.scrollY ); event.preventDefault(); } } const mediaQuery = window.matchMedia( ‘(min-width: 770px)’ ); if ( mediaQuery.matches ) { window.addEventListener( ‘wheel’, replaceVerticalScrollByHorizontal ); }
I'd love to use it but I have two impedments. 1) the elementor version you are using is the pro one, do you know any free way to do the service? 2) my templates page does not show the shortcuts column and I'm not sure why. do you know how overcome it? Thanks
thanks for the tips, is there a way to have a horizontal scroll on the hero images that then transitions on wheel down to a vertical scroll? I saw a website recently that did that and I quite liked it
How would you go about anchoring one of those specific slides to a button above? 3 Buttons, 3 Slides. User clicks button #2 and it taken directly to slide #2.
I just tried this but sideways scrolling has no effect on the slider. The dots and arrows work fine, I can also grab the slides by clicking and dragging, just not the scroll - any ideas?
That's because this is an alternate way of doing it with no JS inbuilt for scroll side swipe. Have you seen this code from here: ua-cam.com/video/wlAoaLM272Y/v-deo.html
@@websquadron Oh, I see. So when you were scrolling the slider to move through the slides, you were clicking and dragging to make that happen? The trouble I'm having is that I only need one middle section to scroll horizontally (there are other ordinary sections with content above and below) but I had hoped for the sideways scrolling to work with a sideways swipe on the mouse (or trackpad), without having to click and drag and not by changing the direction of the up/down scroll. I'd like users to be able to scroll past the section it if they wish, not being forced to consume every slide before they can move on. Perhaps this isn't possible yet.
@@websquadron is there a way to explain this quickly or does it require an update video? I’d love to implement this but I just can’t seem to find anyone that can show me how with elementor.
Awesome !! Sorted another problem of my design struggle!! I am very curious if I use slider in hero section and use pre-made template and use shortcode to display it, it possible right !! But my big afraid is , will it be cause slow page loading or make the page slow load in page speed insight , if it does , any solution for it!! Will be awaiting your response. Big thanks again for big videos.
If you are careful with the size of the template that sits inside the slider then you may be fine, and what you have to do is test. Remember - if the slider is key for the hero banner and the load time is quick (or as quick as you can make it) then go for it.
Created a few new section templates and wanted to show them in a slider but it’s only showing the first one (regardless of which one I put first).. on Elementor forum it seems other users are experimenting the same problem. Do you have any tips?
Have you tried the alternate method - see this: ua-cam.com/video/PEGzIlbSoaQ/v-deo.html ---- this is a better way of doing it, and you can copy over the sections you've built too.
@@websquadron fyi the issue persists... I can only see the first "slide" :((((( anyone else experiences this? I have the latest version of Elementor Pro...
@@websquadron Just sending a quick update FYI, I wrote to Elementor and they opened a ticket for me. They just answered that they are aware there is an issue and they don't know when this will be fixed :/
@@websquadron Thanks for the reply. I've seen some websites that are vertical scrolling but it has a horizontal scrolling section like for instance a portfolio section, and it snaps on that section until the last slide is shown before the vertical scrolling resumes. Is there a way to achieve it using native elementor widgets? Wouldn't want to resort to RevSlider (slows down page speed).
@@jschiavetto it turned out "swipe right" on a desktop looked ridiculous! I had to overrule the graphic designer as the web designer and propose a simpler solution 😏
I must say, I would have probably known from the start when you started mentioning carousel, but as I got older my brain cells also went dead from all of this chemically embedded new population controlled that clearly screams, DIE-DIE-DIE, this good ol american drugs, or should I say frugs because it's not drugs anymore😅🤣a year later and the good thing is I think this video just gave me 1 up of 1 cell back in the brain, but with that being said, peace to palestine and big ol F-U to the clean up crew, and I will keep on moving
dude is ike cooking scrabled eggs easy done.. but you went so deep to married the rooster with a farm chicken and feed hem horse food then teach the rooster how to grab boobs when it does not have hands. dam dude that slide was easy and simple .. just drag into the container a image carousel element.. and set the speeds to slide left of right or fade ..
![Lp. Сердце Вселенной #60 РОЖДЕНИЕ ЛОЛОЛОШКИ [Финал] • Майнкрафт](http://i.ytimg.com/vi/YoR0pAV9FVQ/mqdefault.jpg)
I have left and right container. In the right container height 600px. Inside this right container can you show vertical max post items? 3 Items will be show and more items i can see when i scroll down vertically.
Is it possible?
Thanks
Please give me reply. Is it possible to do?
Could you please make a video that i explain!?
Thanks for your good tutorial
How can I move the slides without using the navigation buttons and scrolling the mouse?
That'll need some JS.
@@websquadron Where can I find the code?
Decided to watch your most popular videos:)
So this is the video #12
Can this be done using the mouse-scroll for horizontal scrolling?
There was some JS code though I've not tested that for a while.
function replaceVerticalScrollByHorizontal( event ) {
if ( event.deltaY !== 0 ) {
window.scroll(window.scrollX + event.deltaY * 2, window.scrollY );
event.preventDefault();
}
}
const mediaQuery = window.matchMedia( ‘(min-width: 770px)’ );
if ( mediaQuery.matches ) {
window.addEventListener( ‘wheel’, replaceVerticalScrollByHorizontal );
}
@@websquadron Not sure if this will work on the Testimonial widget.
I'd love to use it but I have two impedments.
1) the elementor version you are using is the pro one, do you know any free way to do the service?
2) my templates page does not show the shortcuts column and I'm not sure why. do you know how overcome it?
Thanks
Strongly advise you invest in Pro, but an alternate way is to use Slides.
You will need Pro to show the Shortcodes.
Yes I would if I had enough work to justify an annual fee. Slides is also a pro feature. @@websquadron
can I make the template thinner so I can see the next slide in the slider or does it stretch to 100?
You’d have to use the new Elementor carousel widget that allows for offset
Thanks Imran, You're a man of his word
Simplest and easiest workaround :)
It seems that Elementor has been updated. There is a white background on the left and right. :(
Have you set the containers to hide overflow
thanks for the tips, is there a way to have a horizontal scroll on the hero images that then transitions on wheel down to a vertical scroll? I saw a website recently that did that and I quite liked it
Yup with this alternate method:
ua-cam.com/video/PEGzIlbSoaQ/v-deo.html
Can I load a webpage from bottom . I mean from footer to header? I tried it but the page is loading from top. Can you help me with it?
That would require some parallax effects
How would you go about anchoring one of those specific slides to a button above? 3 Buttons, 3 Slides. User clicks button #2 and it taken directly to slide #2.
Not sure (yet)
I just tried this but sideways scrolling has no effect on the slider. The dots and arrows work fine, I can also grab the slides by clicking and dragging, just not the scroll - any ideas?
That's because this is an alternate way of doing it with no JS inbuilt for scroll side swipe.
Have you seen this code from here:
ua-cam.com/video/wlAoaLM272Y/v-deo.html
@@websquadron Oh, I see. So when you were scrolling the slider to move through the slides, you were clicking and dragging to make that happen?
The trouble I'm having is that I only need one middle section to scroll horizontally (there are other ordinary sections with content above and below) but I had hoped for the sideways scrolling to work with a sideways swipe on the mouse (or trackpad), without having to click and drag and not by changing the direction of the up/down scroll. I'd like users to be able to scroll past the section it if they wish, not being forced to consume every slide before they can move on. Perhaps this isn't possible yet.
This helped me, thank you!
Thanks for the great info! I have one problem though, template is not responsive inside the main page. How do I fix that?
You’d have to adjust for the breakpoints
@@websquadron :/ I know. I have my template responsive for all devices but on inside the slider it doesn't work. Do you know how to fix that?
@@SheldonBazingaa are you set to min height and vh 100% for the slider?
brother its a good idea but i really wanted a mouse scroll option as well. this doesnt help with that
Okay
I'm trying this and it doesn't seem to work anymore
That’s because it’s based on Containers now
@@websquadron is there a way to explain this quickly or does it require an update video? I’d love to implement this but I just can’t seem to find anyone that can show me how with elementor.
Awesome !! Sorted another problem of my design struggle!!
I am very curious if I use slider in hero section and use pre-made template and use shortcode to display it, it possible right !! But my big afraid is , will it be cause slow page loading or make the page slow load in page speed insight , if it does , any solution for it!!
Will be awaiting your response.
Big thanks again for big videos.
If you are careful with the size of the template that sits inside the slider then you may be fine, and what you have to do is test. Remember - if the slider is key for the hero banner and the load time is quick (or as quick as you can make it) then go for it.
Created a few new section templates and wanted to show them in a slider but it’s only showing the first one (regardless of which one I put first).. on Elementor forum it seems other users are experimenting the same problem. Do you have any tips?
Have you tried the alternate method - see this: ua-cam.com/video/PEGzIlbSoaQ/v-deo.html ---- this is a better way of doing it, and you can copy over the sections you've built too.
@@websquadron Will try, thank you so much for all you do for the Elementor community
@@marioncouturier5299 Big thanks :)
@@websquadron fyi the issue persists... I can only see the first "slide" :((((( anyone else experiences this? I have the latest version of Elementor Pro...
@@websquadron Just sending a quick update FYI, I wrote to Elementor and they opened a ticket for me. They just answered that they are aware there is an issue and they don't know when this will be fixed :/
Hey Imran, any idea how to get the navigation move slide to slide using scroll?
Not looked into that deeply as it wouldn’t be a great UX.
@@websquadron Thanks for the reply. I've seen some websites that are vertical scrolling but it has a horizontal scrolling section like for instance a portfolio section, and it snaps on that section until the last slide is shown before the vertical scrolling resumes. Is there a way to achieve it using native elementor widgets? Wouldn't want to resort to RevSlider (slows down page speed).
@@rorybekowski4979 Were those websites built with Elementor?
@@rorybekowski4979 that's exactly what I'm trying to do, no joy as yet, and I can't find a way to do it without code. Oh well, coding it is then
@@bobfurness2753 yea dude that’s what I did eventually but for mobile it’s tricky it has to be touch nav
This hack is so much helpful, thanks for sharing! Clean and elegant, nice! 👏 👏 👏
Thanks so much! 😊
Love the trick! Wish Elementor would just give us an actual slider and carousel widget for templates 😂
Totally agree. That was my 3rd video on trying to make it work after tinkering with the code as before it only worked on full width sections
So simple, but so clever. Great!
Glad you like it!
Great tutorial! but when i pasted the shortcode, it just displays the shortcode as text, not the template. anybody know how to fix it?
Are you sure that you're adding the Shortcode into the Content Box? Email me a screenshot of what your edit screen looks like?
info@websquadron.couk
I've just tried this myself and experiencing the exact same issue. Were you guys able to resolve it? Thanks
@@bboybeatle they never emailed in the end but me and others have tried this approach and it works fine. Are you viewing live or preview?
@@websquadron Oops. Now you mention it if I look on the live version it does work! Thanks for the quick reply, I'll give you a sub now 🙏🏻
Absolutely brilliant and I think this might work for my "swipe right" client request! Thank you 👍
So I did this with Containers instead of sections and had to switch to the Testimonials widget to get out the bugs.
@@allisonkessler17 you save my ass LOL
@@jschiavetto it turned out "swipe right" on a desktop looked ridiculous! I had to overrule the graphic designer as the web designer and propose a simpler solution 😏
This is awesome, thank you!
Brilliant! Love you, man. Hate his outro music!
Hehe
Awesome video.
Glad you enjoyed it
hello Imran its me who knocked you a few days ago
that was a big time waste.
Thanks for your feedback.
damn, it is a waste indeed.
Great video! Wish I could have seen how it looks on mobile although it should be like any other slider.
It’s totally fine :)
Hahaha, I thought this will be an automatic change when we scroll down by mouse wheel
Ok
I must say, I would have probably known from the start when you started mentioning carousel, but as I got older my brain cells also went dead from all of this chemically embedded new population controlled that clearly screams, DIE-DIE-DIE, this good ol american drugs, or should I say frugs because it's not drugs anymore😅🤣a year later and the good thing is I think this video just gave me 1 up of 1 cell back in the brain, but with that being said, peace to palestine and big ol F-U to the clean up crew, and I will keep on moving
Ok
dude is ike cooking scrabled eggs easy done.. but you went so deep to married the rooster with a farm chicken and feed hem horse food then teach the rooster how to grab boobs when it does not have hands. dam dude that slide was easy and simple .. just drag into the container a image carousel element.. and set the speeds to slide left of right or fade ..
ok
This tutorial could have been done in 4 minutes.
Yup. You're right. Thanks for your feedback.
@@websquadron np x
I actually recorded an updated version last week that won’t come out until end of June
If you don't no what is horizantel scroll then don't upload any video
KMA.
this a worst thing i ever seen, according its tittel.I just wasted my time by watching this video
Okay.
No knowledge at all, Allah will punish u
Wow. Are you like an undercover angel or something? Good luck with your mission.
Waste of time.
Ok. Thanks.
Maybe stop clickbaiting?
You are just adding a basic elementor slider. There is no horizontal scroll at all.@@websquadron
Does this add a solution for some - Yes. End of. Take care.@@mrmachone
It's not a solution for those who were searching for a horizontal scrolling sections. End of discussion.
Oh wow. You get to end the discussion after throwing an insult Don't forget to unsubscribe. Take care. @@mrmachone
Wordpress and its addons are just trash. Learn how to code.
Learn how to respect others.