HTML Slideshow Code

I am trying to write a code to make a slideshow. I used html and jquery to do it, but it's not working. Here's the code I came up with:
<!DOCTYPE html>
<html dir="ltr" lang="en-US">
<head>
<title> The Justice League of America </title>
<style>
#slideshow {
width: 900px;
height: 304px;
margin: 10px auto 0 auto;
#slideshow .Wrapper-slideshow {
width: 900px;
height: 304px;
float: left;
#slideshow .Content-slideshow {
height: 304px;
#Nav-slideshow {
width: 600px;
height: 30px;
margin: -30px 0 0 10px;
#Nav-slideshow a {
width: 10px;
height: 10px;
border-radius: 6px;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
color: #666;
background: #666;
border: 1px solid #ccc;
display: block;
margin: 0 10px;
float: left;
#Nav-slideshow a.activeSlide{
background: #222;
border: 3px solid #eee;
-moz-border-radius: 8px;
margin: -2px 8px;
</style>
<script type='text/javascript' src='jquery.js'></script>
<script type="text/javascript">
var $j = jQuery.noConflict();
$j(document).ready(function () {
$j("#Content-slideshow").cycle({
fx: 'fade',
pager: '#Nav-slideshow'
</script>
</head>
<body>
<div id="slideshow">
<div class="Wrapper-slideshow">
<div id="Content-slideshow" class="Content-slideshow">
<div class="featureItem"><a href=""><img src="http://cdn.bleedingcool.net/wp-content/uploads/2011/03/justice-league-logo.jpg" title="Justice League"
alt="Justice League Logo" /></a></div>
<div class="featureItem"><a href=""><img src="https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcTd8_Ht69tA0Pmv5CHSJU2WEhX6xonffl3AZFNnvZI0YGbj5tiT" title="Batman"
alt="Bruce Wayne" /></a></div>
<div class="featureItem"><a href=""><img src="https://dailypop.files.wordpress.com/2012/03/justice-league-doom-superman.jpg" title="Superman"
alt="Clark Kent" /></a></div>
<div class="featureItem"><a href=""><img src="http://vignette3.wikia.nocookie.net/dcanimated/images/f/f5/Wonder_Woman.png/revision/latest?cb=20090407084402"
title="Wonder Woman" alt="Princess Diana of Themyscira/Diana Prince" /></a></div>
<div class="featureItem"><a href=""><img src="http://statici.behindthevoiceactors.com/behindthevoiceactors/_img/chars/char_101.jpg" title="Martian Manhunter" alt="J'onn
J'onzz/John Jones" /></a></div>
<div class="featureItem"><a href=""><img src="http://vignette2.wikia.nocookie.net/dcanimated/images/7/7b/Hal_Jordan.png/revision/latest?cb=20080930201433" title="Green
Lantern" alt="Hal Jordan" /></a></div>
<div class="featureItem"><a href=""><img src="http://vignette1.wikia.nocookie.net/dcmovies/images/0/06/Flash_Justice_League9.jpg/revision/latest?cb=20110917201653"
title="The Flash" alt="Barry Allen" /></a></div>
<div class="featureItem"><a href=""><img src="http://ifanboy.com/wp-content/uploads/2011/07/JL_TheEnemyBelow.jpg" title="Aquaman" alt="King
Orin/King of the Seven Seas" /></a></div>
<div class="featureItem"><a href=""><img src="http://vignette3.wikia.nocookie.net/dcanimated/images/f/f2/Hawkgirl.png/revision/latest?cb=20100117155542" title="Hawkgirl"
alt="Shayera Hol" /></a></div>
</div>
<div id="Nav-slideshow"></div>
</div>
</div>
<script type='text/javascript' src='cycle.js'></script>
</body>
</html>
Also this code is linked to another javascript file called jquery.js (you will see they are linked in the above code). I can provide the code for that if you need it to help me.
I've been trying to make a slideshow for days, I just want it to work. Thank you in advance to anyone who can help me.
Quick note: I am not a programmer and I don't understand any languages except for html, so when you answer, don't use programming terms. I won't understand them! That's probably why I am having so much trouble!

Hi,
for working examples see plugins.jquery.com - there re a number of slide-show plugins... you will also probably need jquery.ui also if your jquery plugin is using css animations.
If you are not a programmer then you are probably running your html from the file system.... your computer's hard drive is NOT the internet. You need a web server (either localhost (windows pro and enterprise editions) or a hosted server on the internet
(azure).
Regards.
Rob^_^

Similar Messages

HTML Slideshow

I'm publishing a site with a slideshow of photographs. I have made a flash slideshow with slideshow pro and embedded it into one of my pages by creating a text box and editing the html code to place the slideshow inside. Some people have told me they can't see the slideshow on their office computers and only see a box with a cross in it. I suspect this is because some companies have restricted flash on their employees computers as a friend was prompted to install flash when he went to the page on his home pc using windows and IE. So now I want to make an html slideshow and link to it from the flash page. (along the lines of "if you can't see the slideshow click HERE"). I have made 22 pages each with 22 thumbnails and the large image corresponding to that page. Each thumbnail is hyperlinked to the page displaying its large image. This works but it looks a bit messy as a new page loads for every slide. Is there a way to make only the large image change when a thumbnail is clicked rather than going to a new page? Maybe using html snippets? Thanks.

Thanks. That was exactly what I was after. If only it worked in IE. I spent ages altering the code to make it look the way I wanted and it worked perfectly in Safari but not in Firefox or IE(6). I thought I might have broken it so I started again and made one change at a time while testing it in Firefox. After a few changes I sent it to a friend who said it worked in Firefox but not in IE on his windows PC. If anyone knows html and can see what's wrong the site is:
http://www.brianmckenzie.com.au/htmlgallery/htmlpictureviewer.html
Otherwise it's back to the drawing board.

Export embedded quicktime movies to html slideshow?

I'm trying to make an html slideshow of a keynote presentation that has embedded quicktime movies. The movies just get saved as single png images. Is there a workaround or something obvious I am overlooking?
Since iPhoto lets you do this, I would assume it isn't impossible, but perhaps it just isn't implemented within keynote (which seems kind of backward).

Thanks. I was afraid that was the case, but a former apple VP suggested I ask since there are many apparently undocumented features (and iPhoto/iWeb can do this, so the api exists).
The relevent html code is actually a java script that loads an array of exported png files. Each element of the array is defined like this:
images[2] = "mrnahh.html_files/mrnahh.003.png";
so I tried just telling it to load a mov file instead, but it wasn't so easily fooled. It might be easier for me to make a slideshow of the png files and mov files within iWeb (which really makes messy html and javascripts that are next to impossible to hack.)
Anyway, many thanks. I'll leave this open for now in case someone else knows a simple secret.
The HTML export feature is great, and produces nice clean simple interfaces and web code. I hate to abandon it.

HTML 5 code having a jquery slider is working in safari 4 (also other browsers). Its not working in safari 5.

HTML 5 code having a jquery slider function is working in safari 4. It is also working in IE9, IE8, Firefox 13. In Safari 5, it is not loading. Also CSS is not loading correctly. Its showing failed to load

HTML 5 code having a jquery slider function is working in safari 4. It is also working in IE9, IE8, Firefox 13. In Safari 5, it is not loading. Also CSS is not loading correctly. Its showing failed to load

How do I replace image color with an exact html color code?

I simply want to change the color of a small pic to an existing html color code, 3399CC. The pic is very simple, and only has one color. In Photoshop CS4, I go to: Image -> Adjustments -> Replace Color. For the new replacement color, when I type in 3399CC, it doesn't give me that color - it gives some other shade of that color. (I can tell because I use a program that tells me the exact html code a color is when I hover my mouse over it). It seems the only way to really get the color you want is to adjust the sliders (hue, saturation, and lightness). But it'd be practically impossible to play around with every increment of those sliders until I get the exact color code.
There's got to be a way to simply enter the html color code and have the pic changed to that color. Does anyone have any idea?

Turns key. WhirrRRRrrrrRRRrrrr.... Nothing. (I answered in the other thread)
Perhaps I've had too much coffee today, because I just got a clear vision of Bart Simpson, at the board, chalk in hand...
SRGB IS KING!!! SRGB IS DEAD!!! LONG LIVE SRGB!!!
SRGB IS KING!!! SRGB IS DEAD!!! LONG LIVE SRGB!!!
SRGB IS KING!!! SRGB IS DEAD!!! LONG LIVE SRGB!!!
SRGB IS KING!!! SRGB IS DEAD!!! LONG LIVE SRGB!!!
SRGB IS KING!!! SRGB IS DEAD!!! LONG LIVE SRGB!!!
SRGB IS KING!!! SRGB IS DEAD!!! LONG LIVE SRGB!!!
-Noel

Need help with flashvars in cs5.5 html generated code

how could use flashvars in cs5.5 html generated code, there are tutorial in net about flashvars but its all cs4 with javascript in it while cs5.5 html code doesn't have. here is the code for non-IE generated by cs5.5

<object type="application/x-shockwave-flash" data="sample.swf" width="800" height="800">
<param name="movie" value="sample.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<param name="allowScriptAccess" value="sameDomain" />

<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" />
</a>

how can I put flashvars in html and as3?


<object type="application/x-shockwave-flash" data="sample.swf" width="800" height="800">
<param name="movie" value="sample.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#000000" />
<param name="play" value="true" />
<param name="loop" value="true" />
<param name="wmode" value="window" />
<param name="scale" value="showall" />
<param name="menu" value="true" />
<param name="devicefont" value="false" />
<param name="salign" value="" />
<PARAM NAME=FlashVars VALUE="imageFilename=images%2Fimage1%2Ejpg">
<param name="allowScriptAccess" value="sameDomain" />

<a href="http://www.adobe.com/go/getflash">
<img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.g if" alt="Get Adobe Flash player" />
</a>

and you can read via flash AS3:
http://www.permadi.com/tutorial/flashVars/indexAs3.html

HTML & XML Code Stripped when loaded to web site

Hi,
I just loaded some page changes to my web site and the HTML & XML code was stripped when exported to my web site. I checked the site page code on the web site and it's absent.
Has anybody had this happen and/or can anybody help me fix this problem.
Thanks
Malcolm

Thank you for the response,
This is the link to the page that didn't work. I left it the way was after I downloaded it to the web site is: http://www.susystastebuds.com/Wedding/Wedding.html
I have had this web site running under Dreamweaver for over a year without a problem and It has only just started to do this.
Yahoo hosts my site and I do use the PUT action to post to the web.
I have some Flash items on all my pages and some of them have stopped working properly, which I think means that some of the Flash code is not there either.
I can go to Yahoo web page manger and upload each file and they page will work, but that is a very lengthy process.
Thank you for any more help you can provide.
Malcolm

CQ page is not rendering properly. It is not rendering HTML. It is showing HTML source code as is.

On some of the pages, I am getting this weird behavior wherein page is not rendering properly. It is showing HTML source code as is. Could you please help me out? What could be the issue? And how can we get rid of the same?

Check your component jsp page. it is possible that it is just plan file without directives <@ or you might have miss to close tag which is creating source as text to render
Paste your jsp code in case you need further help
Thanks,
Ajit

I see the license agreement as HTML source code

Hello,
I downloaded a trial version of Adobe Acrobat 9.0,
but after I had installed it and start it, it wants me to agree on the license agreement.
but my problem is that I can't click on Agree nor Disagree because I see only HTML source code
see the printscreen I added below.
does anyone know what is wrong, or wat I have to install to 'use' these HTML pages whitin Adobe Acrobat?
I also downloaded the software again and installed it again and it happens also with trial versions of photoshop,
I have not tested other software so far.
Thanks in advance
Kees
PS: I am dutch so my english is not perfect.

You seem to have missed this thread:
http://www.adobeforums.com/webx/.3bc424c7/
I understand Liam's suggestion has worked for many.

How to read the html source code of a webpage.

How can I read the html source code of a webpage with a java application?
Is there a good idea?

>
How can I read the html source code of a webpage
with a java application?
Is there a good idea?
I don't know if this is a good idea, but it works.
1) Use a URL to obtain the document's location
2) Use a URLConnection to open a connection between your computer and the
document server
3) Connect to the server
4) Get the InputStream of said connection
5) Associate the Input Stream with a Buffered Input Stream
At this point you can use a loop to read lines from the BufferedInput Stream and append them to a TextArea or other suitable text component.

How to get the HTML Source code from the active browser ?

Hi All,
I need to get the HTML Source code from the active browser (IE). I tried with the below code, but I am not able to get the Source code all the time, with respect to the different applications (http or https) and the user authentication has to be changes in few applications (_I dont know or not able to given that in the below code_). More over there is also a dependence of the URL to get the HTML Source code.
Therefore what I feel is getting the HTML Source code from the given or active browser will be consistent than the URL. Since the Source code is available in the browser (IE) . Please help me with a sample code to achieve this . . . !
HTMLDocument doc=(HTMLDocument) kit.createDefaultDocument();
doc.putProperty("IgnoreCharsetDirective", Boolean.TRUE);
URL url = new URL(strURL);
Reader HTMLReader = new InputStreamReader(url.openConnection().getInputStream());
kit.read(HTMLReader, doc, 0);Thanks in advance,
Regards,
Jothi Venkatachalam
Edited by: j0o on May 7, 2009 3:11 AM

The simple answer is: you don't.
Not only is it simply not possible, but the entire concept of "the active browser" doesn't exist.
You were on the right track with your code to retrieve the page directly from the server, but as you noticed that code will only work for regular http connections.
For https and other protocols you will need to use appropriate libraries for each protocol. Something like Apache Commons can help you with that. There are networking libraries in there for a lot of commonly used protocols.

View the html source code of an apex page

Hi everyone,
I search to how I can view the html source code of an apex page and to be able to modify it. That's why viewing the html source code from the browser when the application is running doesn't arrange me.
Has anyone an idea how it can this be possible?
Best regards,

Khadija Khalfallah wrote:
Hi everyone,
I search to how I can view the html source code of an apex page and to be able to modify it. That's why viewing the html source code from the browser when the application is running doesn't arrange me. What do you mean?
Do you want to be able to pull up the HTML source generated by Apex, modify that copy, and then feed it back into Apex with the chagnes you made? If so you can't. Apex generates the HTML through its tools and you have to modify the generation routines to get different HTML.
Do you merely want to look at the generated HTML? In Internet Explorer all you have to do is right click on the page and choose View Source to open a window with the HTML source in an editor. I sometimes find it useful to save a page and manually edit the copy to immediately see the effects of certain changes to the underlying HTML and/or Javascript without permanantly making the change in Apex.

Are we allowed to use the Web developer function in Firefox version 5.0 to edit the html source code associated with the Firefox home page?

Locking at request of OP - https://support.mozilla.com/en-US/questions/844506
Are we allowed to use the Web developer function, under the "Firefox" tab in Firefox version 5.0, to edit the html source code associated with the Firefox version 5.0 home page ( so that we can personalize the home page )? Is this legal?
Sincerely in Christ,
Russell E. Willis

Solution: (Free Download Manager)
Go here: http://codecpack.co/download/Free_Download_Manager.html and download Free Download Manager 3.8.1067 Beta 3, it works perfectly with Firefox 5.0.1
Solution: (to Google mail aka Gmail)
I have had this problem for a while since I did a previous Firefox update, where I had to force Gmail to load in Basic HTML else it's next to impossible to use it. The solution is this: simply update your Java, and Gmail will work without a problem using Standard HTML. To update your Java go here: http://www.java.com/en/ and select "Free Java Download".
And beta normally, universally, means "the not quite there yet version of the version we're aiming for" NORMALLY used during production and testing of a type of software.

How to edit the html source code for my site

I have just started a blog, and am VERY new to it. I am trying to edit the html source code on my site (ie, to insert google adsense search bars). I go to my blog site, get to page source and see the html but I am not able to edit it. Not sure what I am doing wrong. Thanks!

You can use any editor you want mine is set up for notepad.exe
:see http://dmcritchie.mvps.org/firefox/firefox.htm#notepad
:to invoke use "Ctrl+U" or View > Page Source
:this is for sites that you maintain on your local drives or servers, and copy over to a website.

Retrieving HTML source code of a web page

Hi,
I want to take the HTML source code of a web page. How can I take?
Thanks and regards,
Venkat.

You can do that with the class "cl_http_client".
Sample code:
DATA: http_client TYPE REF TO if_http_client .
DATA: w_string TYPE string ,
w_result TYPE string ,
r_str TYPE string .
DATA: result_tab TYPE TABLE OF string.
START-OF-SELECTION .
CLEAR w_string .
w_string = 'http://urlhost/Logs/main.asmx/SetLog'.
CALL METHOD cl_http_client=>create_by_url
EXPORTING
url                = w_string
IMPORTING
client = http_client
EXCEPTIONS
argument_not_found = 1
plugin_not_active = 2
internal_error     = 3
OTHERS = 4.
CALL METHOD HTTP_CLIENT->REQUEST->SET_HEADER_FIELD
EXPORTING
NAME = '~request_method'
VALUE = 'POST'.
CALL METHOD http_client->REQUEST->SET_FORM_FIELD
EXPORTING
NAME = 'title'
VALUE = 'Mail sistema'.
CALL METHOD http_client->REQUEST->SET_FORM_FIELD
EXPORTING
NAME = 'details'
VALUE = 'Funcion 1234'.
CALL METHOD http_client->send
EXCEPTIONS
http_communication_failure = 1
http_invalid_state         = 2.
CALL METHOD http_client->receive
EXCEPTIONS
http_communication_failure = 1
http_invalid_state         = 2
http_processing_failed     = 3.
CLEAR w_result .
w_result = http_client->response->get_cdata( ).
REFRESH result_tab .
SPLIT w_result AT cl_abap_char_utilities=>cr_lf INTO TABLE
result_tab .
READ TABLE result_tab INTO r_str INDEX 2.

HTML Slideshow Code

Similar Messages

Maybe you are looking for