How to create an image slider - slider

I am building an automotive website using bootstrap 5, CSS and JS and I would like to create a car detail page which has an image slider similar to the one on auto trader https://www.autotrader.co.uk/car-details/202202242915123?advertising-location=at_cars&postcode=WC2N5DU&model=Grand%20Cherokee&page=2&make=Jeep&year-to=2022&include-delivery-option=on&sort=relevance and this website https://www.caryandi.com/en/ads/ad-bmw-m2-zambia-chingola-20800. I have searched google and youtube for tutorials but I cant seem to find something similar. Please If anybody can help me with a link or any thing I can refer to I will be more that grateful. I have also included a link to a short youtube video detailing what i am looking for. https://youtu.be/DZIdWpVu5vM

Related

React native image annotations containing a link to a site

I am a complete beginner at react-native. I am trying to create an app where i can take multiple photos and add a tag/label with a link to a website to each of the photos. These links when tapped need to take the user to the specified website. I also want to be able to save all of the tags along with the images for later in the app. I have found some resources(components) regarding this but as a beginner, i do not know how to use any of them. I am listing these below. If anyone can help to use these or give me any direction as to how i can make this project, i would be really grateful.
resources i found:
https://github.com/skicson/react-native-image-annotation
https://github.com/JimmyDaddy/react-native-image-marker

Where would i find the code to edit an iframe ( youtube video) in shopify for a blog?

Where would I find the code to edit an iframe (youtube video) in Shopify? Right now in a blog it is not resizing in mobile and looks half cut off. I have looked in the article folder, blog folder, theme.liquid. I've checked everywhere. I don't even know what code to send you guys so you can help me figure it out. Basically what I am trying to do is find the code and then somehow resize it so it doesn't look cut off in mobile view. Does anyone know how to do that?

Rich links in hangouts chat

I'm working on the sharing aspects of a website, and got stuck with google's hangouts chat.
I want links to the site to be displayed as "cards" with my preview image (ideally, an animated gif), the same way these are:
https://github.com/kkroening/ffmpeg-python
https://xkcd.com/387/
https://www.youtube.com/channel/UC2hxYQtGLEkcOMK4h8JRycA
I was hoping the generic "og:image" meta tag would do the trick, but that's not working
So, I checked out the source code of these pages, but that didn't help either:
In the github page, for example, the url to the image can be found in the og:image and twitter:image:src meta tags. I thought it would be weird for 'twitter:image:src' to be the solution, but I tried anyways. It didn't work.
I've been looking everywhere for some documentation on this, but all I can find is stuff about creating a bot, which is not what I'm looking for.
Thanks for any advice

Get img thumbnails from Yahoo! Screen Video Player (not older webplayer)

I am trying to get yahoo! screen video's image thumbs to embed on my website like we can easily do in other websites ( Get img thumbnails from Vimeo?, How do I get a YouTube video thumbnail from the YouTube API?, etc.).
There used to be a sugestion: Get thumbnail image for Yahoo video? (python) but it doesn't seem to work now with the new Yahoo! Screen.
Some quick searching on the Internets led me to Y!'s very own online help: http://help.yahoo.com/l/in/yahoo/video/using/using005.html;_ylt=Aj3rNfbhKBNyXODHGK5ONSo1qXtG
According to which, all I have to do is Copy the thumbnail code under the Share tab. Unfortunately, I can't seem to find any thumbnail code under the Share tab.
I also couldn't find any Y!Screen api on http://developer.yahoo.com/everything.html that could help me with this... ideas?
Using YQL for cross domain data scraping along with jQuery is the solution that works.
Some of it is sound, some of it is hackish, but that's what scraping is all about I suppose.
The basis for this method was not done by me, but by using a tutorial for Facebook titled
Create a Facebook-style Link Preview Using jQuery & YQL written by Jocelyn Stretton.
Included in the modified JavaScript which serves as a starting point, you will have access and understand how to retrieve the following:
1. Yahoo! Screen Video Webpage Title
2. Yahoo! Screen Thumbnail URL Link
3. Yahoo! Screen Video URL Link
4. Scrape Other meta Tag Content
5. Yahoo Screen Video Embed Code provided by the Yahoo Screen Player itself.
DEMO in jsFiddle!
EDIT: jsFiddle DEMO is no longer subdomain (regionally) dependent for video example.
EDIT 2: For those that would like to see another tutorial based on this .ajax() YQL process, I've made two jsFiddles for Pinterest Data Scraping. You can see that SO Answer here that discusses a lot more in detail for XPATH.

How to get information from a website into my tableview row

The application I'm making is similar to YouTube. It is a TableView that has a custom cell that displays a screenshot of the video, title, duration, and rating. I think I'm able to create this custom cell, my question is what to use to get the information from the website? Thanks for the help, I'm still inexperienced.
Update: Maybe I didn't word it properly, but I meant to get the video and information from a different web site that isn't YouTube for its videos, sorry for the confusion.
You use YouTube's API.