|
HTML - Video Playlist With Thumbnails
I know there are multiple ways to do this, but I'm just interested in the easiest possible way. I want to create a video playlist in which I can have a video player combined with a playlist either on the left or the right in which each video in the playlist has a (perferably automatically) generated thumbnail. The playlist could be xml or whatever, just pure html or flash. I'm assuming it would look the best using flash with FLV video. I've seen numerous tutorials on sites such as adobe on how to do this using Macromedia Flash Pro but they are too complicated. I just want to enter the links to where the videos or hosted. If it can't be that simple, I'm just looking for the most simplistic and easiest method possible. Thanks to anyone patient enough to read and respond to this.
Similar TutorialsI am attempting to embed my Imeem playlist. I checked the "autoplay" box before embedding. Everything works out, but it does NOT autoplay. Any help/suggestions is/are appreciated. I can supply you with whatever info you need to help me. Thanks!! Hi. I've been trying and failing at wrapping text around a mixpod playlist widget. [The widget is in a draft post I'm working on in a blog, not installed as a sidebar gadget.] I'm not technical, and the widget is "flash" technology which befuddles me even further. Fiddling with <div> and "align" codes, I was able to type in text next to the widget, but only in the editor page of Blogger...once I previewed or published it, the text appeared below the widget. I would very much appreciate anyone's ideas. The widget code is: <embed border="0" flashvars="mycolor=5C1400&mycolor2=baac8f&mycolor3=450101&autoplay=false&rand=0& f=4&vol=100&pat=0&grad=false" height="382" name="myflashfetish" pluginspage="http://www.macromedia.com/go/getflashplayer" quality="high" salign="TL" src="http://assets.mixpod.com/swf/mp3/mff-nano.swf?myid=76126179&path=2011/01/26" style="height: 382px; visibility: visible; width: 165px;" type="application/x-shockwave-flash" width="165" wmode="transparent"></embed> Thank you. hi there, i have a last.fm playlist listed on my shop: www.brewrecords.net/shop however whenever you go to a new page it obviously reloads and resets itself. how do i make it so that it continues playinging throughout the site when people are browsing different sections? I've been told frames could possibly cure this but i have no clue what they are or what coding to put any help will be well appreciated! cheers! Below is my code & how it looks... what im trying to do is type in the area inbetween where theres nothing... i tried placing text in alota areas im thinking either it cant be done or needs extra coding Code: <div style="text-align: center; margin-left: auto; visibility:visible; margin-right: auto; width:450px;"> <object width="435" height="270"> <param name="movie" value="http://www.profileplaylist.net/mc/mp3player_new.swf"> </param> <param name="allowscriptaccess" value="never"> </param> <param name="wmode" value="transparent"> </param> <param name="flashvars" value="config=http%3A%2F%2Fwww.indimusic.us%2Fext%2Fpc%2Fconfig_black.xml&mywidth=435&myheight=270&playlist_url=http%3A%2F%2Fwww.indimusic.us%2Floadplaylist.php%3Fplaylist%3D66633792%26t%3D1259344566&wid=os"></param> <embed style="width:435px; visibility:visible; height:270px;" allowScriptAccess="never" src="http://www.profileplaylist.net/mc/mp3player_new.swf" flashvars="config=http%3A%2F%2Fwww.indimusic.us%2Fext%2Fpc%2Fconfig_black.xml&mywidth=435&myheight=270&playlist_url=http://www.indimusic.us/loadplaylist.php?playlist=66633792&t=1259344566&wid=os" width="435" height="270" name="mp3player" wmode="transparent" type="application/x-shockwave-flash" border="0"/> </object><br/></div> Hey all, Is it possible to shut down video screen automatically after displaying the video? I mean, after video is over, is it possible to hide the video screen? ( I tried to use embed tag... <embed src="myVideo" autostart="true" /> ??) Thanks, Doron Hi Everyone I know enough about html to knock up a half decent page but can't do anything too fancy. On my homepage I have a main picture, and I want to have smaller thumbnails underneath... but I want the thumbnails to replace the main picture when they are clicked. I guess I could do this by just linking to a new page with the picture changed but I have seen pages do this without reloading the page everytime. Is this an easy thing to do? Many thanks in advance of any replies posted! Kop442000 i have thousands of large photos on hand and I want to make a webpage within the same page, all the images are made into thumbnail and people could click on it to get large, do I have to use graphics software to manually reduce each image to smaller size first? Is there any handy HTML way (or other) I could solve the problem? Thank you. Kenny HELP!!!! If the following site is opened in IE, most of the thumbnails won't show. The thumbnail actual images are 40x30 pixels - so no resizing going on. Yet in the FrontPage browser, they all show. If opened in FireFox, the thumbnails will all show - I just won't get the vertical scroll bar on the thumbnails from the DIV tags. Very straight forward HTML. What's the problem? Web page with the thumbnail problem: http://www.bryanborough.com/750iL/LADRegulatorValve/ Thanks ahead! Buffbuh I am new to HTML, and have taken just a few classes at a local CC. I am working on a basic photography site, and have the following code working okay. My question follows the code. <html> <head> <style type="text/css"> h1 {font-family: "Times New Roman"; font-size: 46px;} img { border: 4px solid white; float: center; padding: 20px; margin: 20px; } </style> </head> <body> <body bgcolor="black" leftmargin="100" rightmargin="100"> <hr color=#BC8F8F> <h1 align="center"><i><font color="white">Nature Up Close & Personal</i></h1> <hr color=#BC8F8F> <a href="thumbs/IMG_1451thumb.jpg"><img src="images/IMG_1451.jpg" width="225" height="165" border="0"></a> <a href="thumbs/IMG_0191thumb.jpg"><img src="images/IMG_0191.jpg" width="225" height="165" border="0"></a> <a href="thumbs/IMG_8152thumb.jpg"><img src="images/IMG_8152.jpg" width="225" height="165" border="0"></a> <a href="thumbs/spider cropped_1thumb.jpg"><img src="images/spider cropped_1.jpg" width="225" height="165" border="0"></a> <a href="thumbs/IMG_1461_1thumb.jpg"><img src="images/IMG_1461_1.jpg" width="225" height="165" border="0"></a> <a href="thumbs/IMG_1942thumb.jpg"><img src="images/IMG_1942.jpg" width="225" height="165" border="0"></a> <a href="thumbs/IMG_3483thumb.jpg"><img src="images/IMG_3483.jpg" width="225" height="165" border="0"></a> <a href="thumbs/IMG_2283thumb.jpg"><img src="images/IMG_2283.jpg" width="225" height="165" border="0"></a> <a href="thumbs/IMG_1354_1_1thumb.jpg"><img src="images/IMG_1354_1_1.jpg" width="225" height="165" border="0"></a> <a href="thumbs/IMG_8263thumb.jpg"><img src="images/IMG_8263.jpg" width="225" height="165" border="0"></a> <a href="thumbs/IMG_8810thumb.jpg"><img src="images/IMG_8810.jpg" width="225" height="165" border="0"></a> <a href="thumbs/IMG_9937_1_1_1thumb.jpg"><img src="images/IMG_9937_1_1_1.jpg" width="225" height="165" border="0"></a> <a href="thumbs/IMG_7751_2thumb.jpg"><img src="images/IMG_7751_2.jpg" width="225" height="165" border="0"></a> <a href="thumbs/IMG_3025thumb.jpg"><img src="images/IMG_3025.jpg" width="225" height="165" border="0"></a> <a href="thumbs/IMG_3006thumb.jpg"><img src="images/IMG_3006.jpg" width="225" height="165" border="0"></a> <p><h4 align="center"><font color="yellow"><i>Click image to view full size</i></p></a> <p><h3 align="center"><a href="Animals.html"><font color="white"><i> Next: Animals</i></a> <br> <br> <a href="index.html"><font color="blue"><i>Home</i></a> </body> </html> My problem....how do I get the second photo (largest one) centered on the screen, and with a black background? Currently it enlarges fine, but seems to be centered on the left, and with a white background. I'm going to create thumbails with captions below them and I'm wondering what is the best way to do this? Using headings as captions, seperate divs for each image? I was wondering if there was any specific code that i could use to mkae a thumbnail of an image that leads to a larger image, without having to make 2 separate images. Hi - not sure where this should go category-wise so sorry if the answer proves it is in the wrong place. I am making a one page portfolio site and in this is a thumbnail galelry that produces a full screen background change (using Javascript). All is well on my computer in all the browsers that I have checked but for some reason it does not work in IOS or android - the thumbnails do not show but do work in so much as they change the background. This is being produced in wordpress (don't know if this matters) - if I add the images with absolute address they do seem to work - odd??? Head scratching is now at an annoying level. The section that does not work is "work". Any help would be greatly appreciated address is: lucyanne[dot]co Hi I want to display images as thumbnails, that when you click on them they open in a new window at a specified size? Ive seen it before, I think it might be javascript??!! Also, I want to display a lot of text but I want to break it down into 'sections' and give links to these 'sections' at the top of the page so when the user clicks them, it moves to exactly that part on the same page further down, so they wont have to scroll??Is that possible? Thanks, Grainne I was wondering if there are any ways/scripts/commands I can employ, or something web-tricks to improve my thumbnails quality. It's really rather crucial to me since my whole webpage is based on thumbnails viewing. I have an ecommerce website and I want to show 1 big product image, along with a number of thumbnails. I then want the customer to be able to hover over or click the thumbnails and have the thumbnail become the 'big' image. What's the 'most compatible' way of doing this? I don't really want to go with some fancy scripted solution just to find out that half my customers can't see it because their firewall/AV/popup software etc is stopping it... Hello everyone I'm usually good at figuring stuff out, but this time I hit a doozy and can't seem to figure it out, hopefully someone here can help me. I have a gallery blog which is using this theme: http://www.elegantthemes.com/preview/eGallery/ my question is how can I make it so that users can click the thumbnail and go to the post rather than clicking the arrow on the bottom right. I've narrowed it down to <div class="thumbnail-div" style="background-image: url(<?php bloginfo('stylesheet_directory'); ?>/scripts/timthumb.php?src=<?php echo $thumb; ?>&h=159&w=190&zc=0);"> but I don't now how to make them link to the post, any help would be great thank you. Hello all, i hope i have posted in the correct place. I am wondering if anyone is able to help me or even guide me in the right place. I am looking to create a verticle scrolling box that has a thumbnail inside and text to go below it. I am looking to have say other website screen shots with a short description below, all hyper linked. The thing is i would like to add multiple thumbnails and text. Would using a marque be the correct way to go about doing this? or is there other ways? Any help is appreciated, i am a novice so any help and guidence is great. Thanks for your help in advance I am working on "thumbnails", everything shows fine in IE but in FF the "alt" text does not show, what can I do to get the alt text to show in FF please? so i have recently begun learning to write HTML, and are trying my hands on designing a website, but i have a problem, i need a thumbnail-list instead of showing the whole picture. what i have done so far is arrange smaller versions of the full picture in a table, and have each picture link to a separate page with only that picture on in full size, but i don't want to have to manually design a page for every picture. any suggestions as to how i can get around that? for instance would opening a blank page with specified color, style, picture placement and all that, be possible to make from the thumbnail list itself? so that the browser opens a blank page, reads the spesifications from the link that opens the new window, and shows that one picture big? it's really aggravating having to make a separate page for 40-50 pictures... any help would be greatly apreciated. (btw i use IE, not sure wich verson, but a rather late one atleast, and the code i'm using now is this: <!--thumbnail image--> <a href="picture name.html"><img src="images/picture name.jpg" height="100" width="100"/></a> <!--image page--> <html> <head> <title>picture name</title> <link rel="stylesheet" type="text/css" href="css.css"> </head> <body> <h2 class="center">picture name</h2> <a href="gallery.html"><p class="center">back to gallery</a></p> <img src="images/picture name.jpg"/> </body> </html> thx for any help ^^ -Shane (Dentei) |
|||||||