Exciting Upcoming Movies You Can't Miss in 2024

Stay up to date with the most anticipated upcoming movies of the year! This tool provides a curated list of the latest movie releases that are about to hit the theaters, giving you a sneak peek at what's to come. With detailed movie trailers, cast information, and IMDb ratings, you can easily discover new and exciting films. Get ready to explore the most recent titles in cinema, and find your next favorite blockbuster before it even hits the screens! Ff (TMDb) /* Container Style Settings */ body { font-family: Arial, sans-serif; text-align: center; background-color: #1a1a1a; color: #ffffff; margin: 0; padding: 0; } #movie-list { display: flex; flex-wrap: wrap; justify-content: space-around; margin-top: 20px; gap: 20px; } .movie-item { background-color: #1c1c1c; width: calc(33% - 40px); max-width: 400px; padding: 15px; border-radius: 10px; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.7); text-align: center; cursor: pointer; position: relative; } /* Mobile View Adjustment */ @media (max-width: 768px) { .movie-item { width: calc(100% - 40px); /* Full width on mobile */ } } .movie-poster { width: 100%; height: auto; border-radius: 5px; } .movie-title { margin-top: 10px; font-size: 18px; font-weight: bold; } .movie-year { color: #ccc; margin-top: 5px; } .imdb-rating { color: #f5c518; font-weight: bold; margin-top: 5px; position: absolute; top: 10px; left: 10px; background-color: rgba(0, 0, 0, 0.7); padding: 5px; border-radius: 5px; } #footer { margin-top: 50px; color: #ccc; font-size: 14px; max-width: 90%; margin-left: auto; margin-right: auto; } #footer a { color: #f23315; text-decoration: none; } #footer a:hover { text-decoration: underline; } /* Modal styles */ #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; height: 70%; background-color: #000; border-radius: 10px; padding: 15px; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.7); color: #fff; overflow-y: auto; } #closeModal, #closeTrailerModal { position: absolute; top: 10px; right: 20px; color: #ff0000; font-size: 30px; font-weight: bold; cursor: pointer; } .watch-trailer-button { margin-top: 20px; padding: 15px 20px; background-color: #FF0000; color: white; border: none; border-radius: 10px; font-size: 18px; cursor: pointer; text-decoration: none; transition: background-color 0.3s, transform 0.2s; box-shadow: 0 4px 8px rgba(0, 0, 0, 0.7); display: inline-flex; align-items: center; } .watch-trailer-button img { margin-right: 10px; width: 20px; height: 20px; } .watch-trailer-button:hover { background-color: #cc0000; transform: scale(1.05); } This tool was designed by moviesuggests.net. × Watch Trailer × const apiKey = 'acf82a9ff23ceffb8be4567f0a4803d1'; // TMDb API Key let currentPage = 1; function loadUpcomingMovies(page = 1) { const apiUrl = `https://api.themoviedb.org/3/movie/upcoming?api_key=${apiKey}&language=en-US&page=${page}`; fetch(apiUrl) .then(response => { if (!response.ok) { throw new Error('Network response was not ok'); } return response.json(); }) .then(data => { if (data.results && data.results.length > 0) { displayMovies(data.results.slice(0, 20)); } else { document.getElementById('movie-list').innerHTML = 'No movie recommendations available at this time.'; } }) .catch(error => { console.error('Error fetching movie data:', error); document.getElementById('movie-list').innerHTML = 'An error occurred while fetching movie recommendations. Please try again later.'; }); } 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} Release Date: ${movie.release_date} IMDb Rating: ${movie.vote_average}/10 `; movieItem.addEventListener('click', () => getMovieDetails(movie.id)); movieListElement.appendChild(movieItem); }); } function getMovieDetails(movieId) { const apiUrl = `https://api.themoviedb.org/3/movie/${movieId}?api_key=${apiKey}&append_to_response=videos,credits,reviews`; fetch(apiUrl) .then(response => { if (!response.ok) { throw new Error('Network response was not ok'); } return response.json(); }) .then(movie => { const movieDetailsElement = document.getElementById('movieDetails'); movieDetailsElement.innerHTML = ` ${movie.title} (${movie.release_date.split('-')[0]}) ${movie.overview || 'No description available.'} Director: ${movie.credits.crew.find(crew => crew.job === 'Director')?.name || 'N/A'} Cast: ${movie.credits.cast.slice(0, 3).map(actor => actor.name).join(', ') || 'N/A'} Release Date: ${movie.release_date} Duration: ${movie.runtime ? movie.runtime + ' minutes' : 'N/A'} Country: ${movie.production_countries.map(country => country.name).join(', ') || 'N/A'} Genre: ${movie.genres.map(genre => genre.name).join(', ')} IMDb Rating: ${movie.vote_average}/10 Language: ${movie.spoken_languages.map(lang => lang.name).join(', ') || 'N/A'} Age Rating: ${movie.adult ? 'R' : 'PG-13'} `; const reviewsElement = document.getElementById('movieReviews'); if (movie.reviews.results.length > 0) { const reviews = movie.reviews.results.slice(0, 20).map(review => ` ${review.author}: ${review.content} `).join(''); reviewsElement.innerHTML = `Reviews:${reviews}`; } else { reviewsElement.innerHTML = 'No reviews available.'; } if (movie.videos.results.length > 0) { const trailer = movie.videos.results.find(video => video.type === 'Trailer' && video.site === 'YouTube'); if (trailer) { document.getElementById('watchTrailerButton').onclick = function () { openTrailerModal(trailer.key); }; } } document.getElementById('detailsModal').style.display = 'block'; }) .catch(error => { console.error('Error fetching movie details:', error); }); } function openTrailerModal(trailerKey) { const modal = document.getElementById('trailerModal'); const trailerVideo = document.getElementById('trailerVideo'); trailerVideo.src = `https://www.youtube.com/embed/${trailerKey}`; modal.style.display = 'block'; } function closeTrailerModal() { const modal = document.getElementById('trailerModal'); const trailerVideo = document.getElementById('trailerVideo'); trailerVideo.src = ''; modal.style.display = 'none'; } function closeDetailsModal() { document.getElementById('detailsModal').style.display = 'none'; } document.addEventListener('DOMContentLoaded', () => { loadUpcomingMovies(currentPage); });

Upcoming Movies

Leave a Reply Cancel reply

Latest Movie Trailers

Leave a Reply Cancel reply

YOU MAY BE INTERESTED IN THESE MOVIE LISTS