Changing Content within an HTML Slide on Wordpress Slider

Posted on 2012-08-30
Last Modified: 2012-09-14
Hi folks,

I have an unusual question and I am extremely limited on my Java knowledge. I'm mostly just an html dude. But here is my dilemma. I have a slider on my website that holds custom html in each slide. I would like to put a series of thumbnails in the slide and when clicked, another set of html appears within the slide. Someone told me to use JavaScript and AJAX, but I really could use a tutorial or a good head start on how I could accomplish this. I tried making a few tables within an html page and using anchors within the page to snap to when a link is clicked, but the page jumps all over the place with that method. If anyone could help or has any suggestions I would be eternally grateful! Thanks!
Question by:mikiebargman
    1 Comment
    LVL 11

    Accepted Solution

    you can change the html of an element (div, td, span, etc) wiht the jquery .html() method.

    Where the content comes from is up to you.
    You could make an ajax call to a serverside script which generates the new code with a database query.
    You can load external html files into your container div with jquery .load() method.

    You can have your content already loaded into the dom and hide and show the set you want by css display:none - display:block with the .css() method.

    The ways are infinite. Just like god ones.

    Featured Post

    6 Surprising Benefits of Threat Intelligence

    All sorts of threat intelligence is available on the web. Intelligence you can learn from, and use to anticipate and prepare for future attacks.

    Join & Write a Comment

    Introduction JSON is an acronym for JavaScript Object Notation.  It is a text-string data transport mechanism, capable of representing simple or complex data structures in a consistent and easy-to-read manner.  Similar in concept to XML, but more e…
    SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
    In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
    In this tutorial viewers will learn how to code links for mobile sites that, once clicked, send a call or text to a specified number. For a telephone link (once clicked, calls a number), begin with a normal "<a href=" link tag. For the href, specify…

    745 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    21 Experts available now in Live!

    Get 1:1 Help Now