VERY GOOD EXPLANATION, no destructive music, clear voice no jargon, no beating around the bush straight to the point every line explained THANK YOU VERY MUCH.
OKAY I HAVE BEEN TRYING TO RECREATE THIS WITH A DIFFERENT FUNCTION AND IT DID NOT WORK I AM LOSING MY MINF BUT THANKS FOR THIS CODE I AM SO DAMN GRATEFUL BECAUSE I HAVE A WEBSITE TO MAKE AND SUBMIT IN 5 DAYS FOR A PROJECT AND I HAVE BEEN STUCK AT MAKING THIS CARSOUEL FOR 2 DAYS BECAUSE MY JAVA SCRIPT IS BAD HOWEVER I KNOW THAT YOU DON'T CARE SO THANKS THANKS THANKS THANKS THANKS ALSO THANKS TO THE VIDEO MAKER GUY FOR THE OG CODE CUZ I DON'T KNOW JS THAT WELL AND UR EXPLAINATION WAS GREAT OKAY IM RUNNING OUTTA TIME BY THANKS THANKS THANKS THANKS THANKS THANKS THANKS THANKS THANKS THANKS THANKS THANKS THANKS
Sir me ne fiverr pe six months pehly account bnaya tha, kisi waja se kam start na kr ska, WordPress se related gigs bnai thi Now i want to start freelancing again because im free now Pochna just ye he k muje new account bnana chahye ya wohi purana account Agr wohi account use kru to kya customer ko ye ni lge ga k is ne to six months se ak b order complete ni kya, customer negative ni ho jay ga? Pls guide me
I did exactly what you did, and I even made sure that I did by checking my code. However, when I hit the next and previous buttons, you can tell they are being pressed however, the images don’t change at all
@@Vikrant_DubeyI ha have same issue 😔 Maine check Kiya to console me error hai goNext is not defined at HTMLbuttonElement.onclick aa raha hai please help 😢
Coz first we have to arrange the images in a systematic way, in a line. Then we have to slide those images on that line of images. In these case the first slide function arranges the images and the second one is the function for the slider Hope these helps 🙂✊
here is the solution for this bug function Prev() { if (counter == 0) { } else { counter++ slideimage() } }; function Next() { if (counter == (slides.length*-1)+1) { } else { counter-- slideimage() } }
What if we want the image slider to be like a wheel. So that when you click on the next button after the last image, the slider still slides forward but shows the first image instead of sliding backwards to the first image. And vice versa
What if we want the image slider to be like a wheel. So that when you click on the next button after the last image, the slider still slides forward but shows the first image instead of sliding backwards to the first image. And vice versa
VERY GOOD EXPLANATION, no destructive music, clear voice no jargon, no beating around the bush straight to the point every line explained THANK YOU VERY MUCH.
function gonext() {
if(count == 3){
return
}
count++
slider()
}
function gopreview() {
if(count == 0){
return
}
count--
slider()
}
My favourite tutor on internet
my also
Inki GitHub I'd kya h
@@HassaanHaider313 inki GitHub I'd kya h
Excellent Explanation Sir!!!
Aapka explain karnay ka tarika bahuth badiya. Thank you very much.
It's was easy😅, just takes a little thinking.
const goNext = () => {
if (counter < slides.length - 1) {
counter++;
slideImage();
}
};
const goPrev = () => {
if (counter != 0) {
counter--;
slideImage();
}
};
I did the same as shown in video but I am getting error.
When I checked in console it is showing slides.forEach is not a function.
Please help
Yeh tw Galat code hai try kia but hua he nahi😊
@@Himanshua09 make sure you used querySelectorAll() not querySelector()
Following changes must be done in 'goPrev' and 'goNext' functions to fix this BUG:
const goPrev = () => {
if (counter == 0) {
counter = slides.length - 1;
slideShow();
} else {
counter--;
slideShow();
}
}
const goNext = () => {
if (counter == slides.length - 1) {
counter = 0;
slideShow();
} else {
counter++;
slideShow();
}
}
Thanx buddy
I did the same as shown in video but I am getting error.
When I checked in console it is showing slides.forEach is not a function.
Please help
Can anyone tell me how he hoisted arrow function (slideImage()) 🤔🤔🤔
use array from() method to fix this foEeach loop error@@Himanshua09
OKAY I HAVE BEEN TRYING TO RECREATE THIS WITH A DIFFERENT FUNCTION AND IT DID NOT WORK I AM LOSING MY MINF BUT THANKS FOR THIS CODE I AM SO DAMN GRATEFUL BECAUSE I HAVE A WEBSITE TO MAKE AND SUBMIT IN 5 DAYS FOR A PROJECT AND I HAVE BEEN STUCK AT MAKING THIS CARSOUEL FOR 2 DAYS BECAUSE MY JAVA SCRIPT IS BAD HOWEVER I KNOW THAT YOU DON'T CARE SO THANKS THANKS THANKS THANKS THANKS ALSO THANKS TO THE VIDEO MAKER GUY FOR THE OG CODE CUZ I DON'T KNOW JS THAT WELL AND UR EXPLAINATION WAS GREAT OKAY IM RUNNING OUTTA TIME BY THANKS THANKS THANKS THANKS THANKS THANKS THANKS THANKS THANKS THANKS THANKS THANKS THANKS
This project help me. And I create with help of slider automatically slide prev and Next.
Thanks Sir!
Wa wa wa kya teaching mja aa gya ❤❤ 1 no sir 🎉
best javascript playlist which have helped me in getting a grip on javascript.
This is a very very helpful video
Thanks for sharing
Seriously man, this helped me a lot, thank you very much
sir this is very helpful
great job brother...its very helpful for me
Awesome, very clear and easy
thanks a lot sir, this video helped me a lot i regret why haven't i came here before wasting my hours on coding
Thank you for this video 🙏🏻
This is a very helpful video.
Thanks sir
REALLY HELPFULL THANKU!❣
Welcome and Thanks a Lot.
this series was pretty helpful, now i am comfortable in javascript
I did the same as shown in video but I am getting error.
When I checked in console it is showing slides.forEach is not a function.
Please help
@@Himanshua09
const slides=document.querySelectorAll('.slide')
let counter=0
slides.forEach((slide,index)=>{
slide.style.left=`${index*100}%`
})
const slideImage=()=>{
slides.forEach((slide)=>{
slide.style.transform=`translateX(-${counter*100}%)`
})
}
const goNext=()=>{
counter++
if(counter>3)
counter=3
slideImage()
}
const goPrev=()=>{
counter--
if(counter
@@Himanshua09 console and check that have you selected all the slides in the slide variable ...
@@Himanshua09 check slides is array of images items or not.
const prev = () => {
if (counter > 0) {
counter--;
slideimg();
}
}
const nxt = () => {
if (counter < slides.length - 1) {
counter++;
slideimg();
}
}
This is really very very very helpful for me using this concept I make better the my UI
thanks a lot buddy,this video really saved my ass.
great video
Wow great explanation
I did the same as shown in video but I am getting error.
When I checked in console it is showing slides.forEach is not a function.
Please help
Very nicely explained sir.
awesome...bohot sahi
Thanks sir please keep making video and explaining everything very neatly step by step
Thanks bro )
Sir this video help me a lot but meko js bilkul nhi samajta😢
Js apko nhi smjhega apko js ko smjhna pdega😂
😂😂😂@@CrazyvlogsH
Try kart rhy
Nice explanation
Sir please make a video on responsive nav bar
very helpfull
Big fan
const slides = document.querySelectorAll(".slide")
var counter = 0;
slides.forEach(
(slide, index) =>{
slide.style.left = `$(index * 100)%`
}
)
const goPrev = () =>
{
counter--
slideImage()
}
const goNext = () =>
{
counter++
slideImage()
}
const slideImage = () =>
{
slides.forEach(
(slide) => {
slide.style.transform = `translateX(-${counter * 100}%)`
}
)
}
Sir me ne fiverr pe six months pehly account bnaya tha, kisi waja se kam start na kr ska, WordPress se related gigs bnai thi
Now i want to start freelancing again because im free now
Pochna just ye he k muje new account bnana chahye ya wohi purana account
Agr wohi account use kru to kya customer ko ye ni lge ga k is ne to six months se ak b order complete ni kya, customer negative ni ho jay ga? Pls guide me
Freelancing me kya karna hota hai
Kya programing language aana chahiye
Esme kya karna hota hai
Kya kya aana chahiye
I did exactly what you did, and I even made sure that I did by checking my code. However, when I hit the next and previous buttons, you can tell they are being pressed however, the images don’t change at all
check again with zoom
Yes even I got this issue, images doesn't change after clicking next and prev
slide.style.transform = `translateX(-${counter * 100}%)`; may be in this line you are using single quotes use tilde copy paste this code line
@@Vikrant_DubeyI ha have same issue 😔 Maine check Kiya to console me error hai goNext is not defined at HTMLbuttonElement.onclick aa raha hai please help 😢
I also
What level of project should we done for internship
Loved it!! you made it super easy to understand
Sir pls make video on ping pong game by javascript , pleaseee sir it will be very helpful
Aapko JavaScript aata hai
easy to understand
Can anyone tell me how he hoisted arrow function (slideImage()) 🤔🤔🤔
nice video
Excellent, thank sir.
Would you please make autoplay list
good work help to me.
Superb
Thank youuu
super
nice
why do we need to write slide image function twice?
Coz first we have to arrange the images in a systematic way, in a line. Then we have to slide those images on that line of images.
In these case the first slide function arranges the images and the second one is the function for the slider
Hope these helps 🙂✊
I did the same as shown in video but I am getting error.
When I checked in console it is showing slides.forEach is not a function.
Please help
mere hisab se bright theme better hai
Can use this for the first the slide after last slide
translateX(-${(counter%4)*100}%)
Yes bro...👍
bro but in my laptop this ${} does not work i dont know why
Dear sir, Thanks for this type of video but please provide it's source code
Please make a separate playlist for this
bhai kiska ye transition effect aa rah hai kya ?? mera pata nhi kyu sirf image change ho raha hai but transition me slide nhi ho rah!
please send us logic that empty box which is not found in the github link I really need that code ..
Sir where this code is available, may you please provide the link?
Can anyone tell me how he hoisted arrow function (slideImage()) 🤔🤔🤔
const slideImage = ( ) => {
//code for functions
}
Could you please provide some php project????? Please....
how can I make them switch automatically
my javascript code is not working plz share the code
❤❤❤
in script code why this is not working for me
slides.forEach(
(slide,index) =>{
slide.style.left=`$(index*100)%`
}
)
It's brackets should be changed to
${index*100}%
@@brijeshpoojary1791 kk thnks
After dollar sign use curly braces {}, not parenthesise (), while using template literal...
Slide end kaise hoga
Sir kon s theam use karte hoo in vs code
Error Index is not recognize
const slides = document.querySelectorAll(".slide")
var counter = 0;
console.log(slides)
slides.forEach(
(slide,index) => {
slide.style.bottom = '${index * 100}%'
}
)
index Error
Please avoid text display on screen at code editor page
Ye example to automatically chalta hai bro, however, good job
Jquery se slick skider kese lagaye
clean
I tried it as it is but not working
Sir can you please make it infinite.that after last image first image will run.
Sir iska source code kha Mila ga
the code is not working 😕
it is working for me
here is the solution for this bug
function Prev() {
if (counter == 0) {
} else {
counter++
slideimage()
}
};
function Next() {
if (counter == (slides.length*-1)+1) {
} else {
counter--
slideimage()
}
}
What if we want the image slider to be like a wheel. So that when you click on the next button after the last image, the slider still slides forward but shows the first image instead of sliding backwards to the first image.
And vice versa
I cannot use .style.left or .style.transform. There seems to be an error with the "slide" variable but I've followed every step.
same problem
where is your github link
how to make this auto change😅
where is the link for source code
❤️❤️❤️❤️
Where is the github link?
if you provide source code then it will easy bro
Can you share code of this image slider
ye tatto hai nai kare ga
@@MUHAMMADUMAR-fe7ec yr img slider ki koi range hi ni h
Back krty rho hota rhy ga
Here you go,
const goNext = () => {
if (counter < slides.length - 1) {
counter++;
slideImage();
}
};
const goPrev = () => {
if (counter != 0) {
counter--;
slideImage();
}
};
Sir code not working
" 0 * 100 " = zero "0" hota h sir ,"1*100"= 100 hota h sir
What if we want the image slider to be like a wheel. So that when you click on the next button after the last image, the slider still slides forward but shows the first image instead of sliding backwards to the first image.
And vice versa
i was also looking solution for this case
Use modulo on counter
Sir g me ne like subscribe or share kr ke apni fee pay krdi hy
source code?
Ye Jo aap bolte h to likh jata h isse kafi dikkat hoti h
Not working
You mismatched the code. You must have written wrong code otherwise the code works well.
I did the same as shown in video but I am getting error.
When I checked in console it is showing slides.forEach is not a function.
Please help
check in console, u may not be assigning the images in slides variable.
alos check JS connection
translate spelling mistake😅
Sir please give this projector source code or GitHub link
sir pehle haddi to banalo fir style lagana!
Kia Matlab ?
it doesn't work thank you for wasting my time
Sir can you please make it infinite.that after last image first image will run.
my javascript code is not working plz share the code.