Netflix Movies

Hey there! Ready to dive into the world of Netflix movies? This page is all about helping you find the best of what Netflix has to offer. Whether you're in the mood for an action-packed blockbuster, a heartfelt drama, or a mind-bending sci-fi adventure, we've got you covered with our top picks. Netflix Movie Recommendation (TMDb) body { font-family: 'Roboto', sans-serif; background-color: #141414; color: #e5e5e5; margin: 0; padding: 0; overflow-x: hidden; } #header { display: none; } #genre-container { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; justify-content: center; align-items: center; margin-top: 20px; padding: 20px; background-color: #333333; border-radius: 10px; box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.5); } .genre-checkbox { display: flex; align-items: center; justify-content: center; margin-bottom: 10px; } .genre-checkbox input { margin-right: 5px; } #movie-list { display: flex; flex-wrap: wrap; justify-content: space-around; margin-top: 20px; gap: 20px; } .movie-item { background: linear-gradient(135deg, #333333, #141414); width: calc(33% - 40px); max-width: 300px; padding: 15px; border-radius: 15px; box-shadow: 0px 6px 15px rgba(0, 0, 0, 0.5); text-align: center; cursor: pointer; position: relative; transition: transform 0.3s, box-shadow 0.3s; } @media (max-width: 768px) { .movie-item { width: calc(50% - 20px); } } .movie-item:hover { transform: scale(1.05); box-shadow: 0px 8px 20px rgba(0, 0, 0, 0.7); } .movie-poster { width: 100%; height: auto; border-radius: 10px; transition: transform 0.3s; border: 2px solid #e50914; } .movie-title { color: #e5e5e5; margin-top: 10px; font-size: 24px; font-weight: bold; } .movie-year { color: #b3b3b3; margin-top: 5px; } .imdb-rating { color: #f5c518; font-weight: bold; margin-top: 5px; } #welcome-message { background-color: #e50914; color: #ffffff; padding: 20px; font-size: 28px; font-family: 'Roboto', sans-serif; border-radius: 15px; margin: 20px auto; width: fit-content; box-shadow: 0 6px 15px rgba(0, 0, 0, 0.5); text-align: center; } .pagination { margin-top: 20px; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; } .page-button { padding: 10px 15px; font-size: 18px; cursor: pointer; background-color: #e50914; color: #e5e5e5; border: none; border-radius: 10px; transition: background-color 0.3s, transform 0.2s; } .page-button:hover { background-color: #b20710; transform: scale(1.1); } .page-button.active { background-color: #b20710; color: #ffffff; font-weight: bold; } #detailsModal, #trailerModal { display: none; position: fixed; z-index: 1000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); } #detailsModalContent, #trailerModalContent { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 90%; max-width: 800px; background-color: #333333; border-radius: 20px; padding: 20px; color: #e5e5e5; box-shadow: 0px 4px 16px rgba(0, 0, 0, 0.7); overflow-y: auto; max-height: 80%; } #closeModal, #closeTrailerModal { position: absolute; top: 10px; right: 20px; color: #e50914; font-size: 30px; font-weight: bold; cursor: pointer; } .watch-trailer-button { margin-top: 20px; padding: 15px 25px; background-color: #e50914; color: #ffffff; border: none; border-radius: 15px; font-size: 18px; cursor: pointer; display: inline-flex; align-items: center; box-shadow: 0px 4px 12px rgba(0, 0, 0, 0.5); } .watch-trailer-button:hover { background-color: #b20710; } .review-author { color: #f5c518; font-weight: bold; } 🎬 Welcome to Netflix! Discover the best movies available! 🎥 Action Animation Comedy Drama Fantasy Horror Science Fiction Family War Western × 🎥 Watch Trailer 🎥 × const apiKey = 'acf82a9ff23ceffb8be4567f0a4803d1'; // TMDb API Key let currentPage = 1; let currentTrailerKey = null; window.onload = function () { getMovieRecommendation(currentPage); updatePagination(); }; async function getMovieRecommendation(page) { const genreFilter = getSelectedGenres(); const apiUrl = `https://api.themoviedb.org/3/discover/movie?api_key=${apiKey}&with_watch_providers=8&watch_region=US&sort_by=popularity.desc&page=${page}&vote_average.gte=6${genreFilter}`; try { const response = await fetch(apiUrl); const data = await response.json(); displayMovies(data.results); } catch (error) { console.error('Error fetching movie data:', error); } } function getSelectedGenres() { const checkboxes = document.querySelectorAll('#genre-container input[type="checkbox"]:checked'); const genres = Array.from(checkboxes).map(checkbox => checkbox.value); return genres.length > 0 ? `&with_genres=${genres.join(',')}` : ''; } function displayMovies(movies) { const movieListElement = document.getElementById('movie-list'); movieListElement.innerHTML = ''; movies.forEach(movie => { const movieItem = document.createElement('div'); movieItem.className = 'movie-item'; movieItem.innerHTML = ` ${movie.title} ${movie.release_date.split('-')[0]} IMDb: ${movie.vote_average}/10 `; movieItem.addEventListener('click', () => openDetailsModal(movie.id)); movieListElement.appendChild(movieItem); }); } function updatePagination() { const paginationElement = document.getElementById('pagination'); paginationElement.innerHTML = ''; for (let i = 1; i { currentPage = i; getMovieRecommendation(i); updatePagination(); scrollToMovies(); }; if (i === currentPage) { button.classList.add('active'); } paginationElement.appendChild(button); } } function scrollToMovies() { const movieList = document.getElementById('movie-list'); movieList.scrollIntoView({ behavior: 'smooth' }); } async function openDetailsModal(movieId) { const apiUrl = `https://api.themoviedb.org/3/movie/${movieId}?api_key=${apiKey}&append_to_response=videos,credits,reviews`; try { const response = await fetch(apiUrl); const movie = await response.json(); document.getElementById('movieDetails').innerHTML = ` ${movie.title} (${movie.release_date.split('-')[0]}) Overview: ${movie.overview} Release Year: ${movie.release_date.split('-')[0]} IMDb Rating: ${movie.vote_average} Director: ${movie.credits.crew.find(member => member.job === 'Director').name} Cast: ${movie.credits.cast.slice(0, 5).map(actor => actor.name).join(', ')} `; const trailer = movie.videos.results.find(video => video.type === 'Trailer'); if (trailer) { currentTrailerKey = trailer.key; } else { currentTrailerKey = null; } const reviewsHtml = movie.reviews.results.map(review => ` ${review.author} ${review.content} `).join(''); document.getElementById('reviewsSection').innerHTML = `User Reviews:${reviewsHtml || 'No reviews available.'}`; document.getElementById('detailsModal').style.display = 'block'; } catch (error) { console.error('Error fetching movie details:', error); } } function closeDetailsModal() { document.getElementById('detailsModal').style.display = 'none'; } function openTrailerModal() { if (currentTrailerKey) { document.getElementById('trailerContent').innerHTML = ` `; document.getElementById('trailerModal').style.display = 'block'; } } function closeTrailerModal() { document.getElementById('trailerModal').style.display = 'none'; document.getElementById('trailerContent').innerHTML = ''; } function filterMoviesByGenre() { currentPage = 1; getMovieRecommendation(currentPage); updatePagination(); } Our recommendation page makes exploring Netflix's vast collection a breeze. Action, comedy, thriller, romance – whatever you're craving, it's all right here. Just check the genres that spark your interest and discover the perfect movie for your night in. So, grab your snacks, settle in, and let the Netflix binge begin. Let's find your next favorite movie together!

Leave a Reply Cancel reply

YOU MAY BE INTERESTED IN THESE MOVIE LISTS