Help with scrolling image gallery?

Hi, using the code for a scrolling image gallery found here (Build an Infinite Scrolling Photo Banner With HTML and CSS | Design Shack). When I pasted in the CSS and HTML, it displayed all vertically and broke my title div. Not a professional, so I could use an expert eye to point out any mistakes. Trying to make title in vertical center of page, scrolling image gallery horizontal in the middle, and links directly below. HTML is below:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<!-- TemplateBeginEditable name="doctitle" -->
<title>Marc Moss Art</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<link href="style.css" rel="stylesheet" type="text/css">
<link href="../../../../style.css" rel="stylesheet" type="text/css">
<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<body topmargin="600">
<div id="wrapper">
<div class="container">
  <header></header>
  <div id="content" style="height:300px;width:1000px;float:left;"><h1>art by marc moss</h1>
</div>
    <!-- Each image is 350px by 233px -->
    <div class="photobanner">
        <img class="first" src="../../../../mosspictures/DSCN0038.JPG" alt="">
        <img src="../../../../mosspictures/DSCN0040.JPG" alt="">
        <img src="image-3.jpg" alt="">
        <img src="image-4.jpg" alt="">
        <img src="image-5.jpg" alt="">
        <img src="image-6.jpg" alt="">
        <img src="image-1.jpg" alt="">
        <img src="image-2.jpg" alt="">
        <img src="image-3.jpg" alt="">
        <img src="image-4.jpg" alt="">
    </div>
    <nav>
    <div id="navigation">
    <ul>
    <li><a href="#">bio</a></li>
    <li><a href= "#">inspiration</a></li>
    </ul>
    </div>
    </nav>
<!-- end .content --></article>
  <footer>
</footer>
  <!-- end .container --></div>
  </div>
</body>
</html>

Is this supposed to be a WordPress site?  None of these images are found on the server.  Those folders don't exist either.
<img class="first" src="mosspictures/DSCN0038.JPG" alt="">
   <img src="mosspictures/DSCN0040.JPG" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-3.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-4.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-5.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-6.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-1.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-2.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-3.jpg" alt="">
   <img src="wordpress/wp-content/themes/MarcMossTheme/image-4.jpg" alt="">
Nancy O.

Similar Messages

  • Help with scrolling photo gallery

    I'm using the code below to for a scrolling photo gallery. I got this from another forum on Adobe. My problem is that I can't get my images to upload. I uploaded this for an image but it's not working:
    <img src="images/baca_poster_small.jpg" data-cycle-title="image1">
    Can someone please help me with getting my pictures to work in this?
    Thanks!
    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>HTML5 document with Cycle2</title>
    <!--Latest jQuery Core Library-->
    <script src="http://code.jquery.com/jquery-latest.min.js">
    </script>
    <!--Cycle2 Plugin Script-->
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery.cycle2/20130409/jquery.cycle2.min.js"></script>
    <style>
    .cycle-slideshow, .cycle-slideshow * {
    -webkit-box-sizing:border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    margin:0 auto;
    width:45%; /**adjust width as required**/
    .cycle-slideshow img {width: 100%;}
    </style>
    </head>
    <body>
    <h1><a href="http://www.malsup.com/jquery/cycle2/">jQuery Cycle 2</a> Responsive Slideshow</h1>
    <!--begin slideshow-->
    <div class="cycle-slideshow"
        data-cycle-pause-on-hover="true"
        data-cycle-speed="700"
    >
    <!--your images go here-->
    <img src="http://malsup.github.com/images/beach1.jpg" data-cycle-title="beach1">
    <img src="http://malsup.github.com/images/beach2.jpg" data-cycle-title="beach2">
    <img src="http://malsup.github.com/images/beach3.jpg" data-cycle-title="beach3">
    <img src="http://malsup.github.com/images/beach4.jpg" data-cycle-title="beach4">
    <img src="http://malsup.github.com/images/beach9.jpg" data-cycle-title="beach9">
    <!--end slideshow-->
    </div>
    </body>
    </html>

    Is this supposed to be a WordPress site?  None of these images are found on the server.  Those folders don't exist either.
    <img class="first" src="mosspictures/DSCN0038.JPG" alt="">
       <img src="mosspictures/DSCN0040.JPG" alt="">
       <img src="wordpress/wp-content/themes/MarcMossTheme/image-3.jpg" alt="">
       <img src="wordpress/wp-content/themes/MarcMossTheme/image-4.jpg" alt="">
       <img src="wordpress/wp-content/themes/MarcMossTheme/image-5.jpg" alt="">
       <img src="wordpress/wp-content/themes/MarcMossTheme/image-6.jpg" alt="">
       <img src="wordpress/wp-content/themes/MarcMossTheme/image-1.jpg" alt="">
       <img src="wordpress/wp-content/themes/MarcMossTheme/image-2.jpg" alt="">
       <img src="wordpress/wp-content/themes/MarcMossTheme/image-3.jpg" alt="">
       <img src="wordpress/wp-content/themes/MarcMossTheme/image-4.jpg" alt="">
    Nancy O.

  • Help with CSS image Gallery

    Found this simple css image gallery. However I'm having trouble adjusting it do my needs. I ideally want to make each small image slightly bigger than currently and have 3 or 4 on each line. Also want to make the enlarged image bigger. The width would need to be around 550px.
    <style type="text/css">
    * This notice MUST stay intact for legal use.
    * This script was created for FREE CSS Menus.
    * Visit: www.freecssmenus.co.uk for more CSS.
    * Also visit our Free online menu creator.
    /* credits: www.freecssmenus.co.uk */
    #pg { width:390px;
    height:200px;
    border:2px dotted #666;
    padding:5px;
    padding-top:15px;
    #pg ul { list-style:none;
      padding:0;
      margin:0;
      width:180px;
      position:relative;
      float:left;
    #pg ul li { display:inline;
      width:52px;
      height:52px;
      float:left;
      margin:0 0 8px 8px;
    #pg ul li a { display:block;
      width:50px;
      height:50px;
      text-decoration:none;
      border:1px solid #000;
    #pg ul li a img { display:block;
      width:50px;
      height:50px;
      border:0;
    #pg ul li a:hover { white-space:normal;
      border-color:#336600;
    background-color:#AABB33;
    #pg ul li a:hover img { position:absolute;
      left:190px;
    top:0;
      width:auto;
      height:110px;
      border:1px solid #000;
    #pg ul li a span {display:none}
    #pg ul li a:hover span { display:block;
    position:absolute;
      left:5px;
      top:130px;
      width:350px;
      height:auto;
    font-size:12px;
    color:#999999;
    </style>
    html
    <div id="pg">
      <ul>
      <li>
    <a href="css_rollover_uk_map.php">
    <img src="upimage/ukmap345.jpg" alt="Css Rollover Map" />
    <span>
    <strong>
    CSS Map.</strong>
    CSS Image swap on rollover/hover. This simple display of CSS shows the versatility of Cascading Style Sheets. Remember this animation is 100% User Accessible.</span>
    </a>
    </li>
      <li>
    <a href="big_css_button.php">
    <img src="upimage/bigbutton1390.jpg" alt="Large Css Button" />
    <span>
    <strong>
    CSS Big Button.</strong>
    Css buttons can be as large and as extravagant as you like. Using one image you can create simple css buttons like this. This button is still a hyperlink not just an image.</span>
    </a>
    </li>
      <li>
    <a href="menu_opacity.php">
    <img src="upimage/003opacity639.jpg" alt="Css Opacity" />
    <span>
    <strong>
    CSS Opacity Menu.</strong>
      you can use styles to change the opacity of an image. This creates interesting effects when creating a menu. </span>
    </a>
    </li>
      <li>
    <a href="#">
    <img src="upimage/freemusic885.jpg" alt="Free Mp3 Downloads: Unborn Records" />
    <span>
    <strong>
    Unborn Records </strong>
    Download free mp3 music for your ipod or mp3 player. Download free music from unsigned artists</span>
    </a>
    </li>
      <li>
    <a href="#">
    <img src="upimage/trix363.jpg" alt="Visit Trix the dog at www.catandtwodogs.co.u" />
    <span>
    <strong>
    Cat And Two Dogs </strong>
    Visit my three pets at www.catandtwodogs.co.uk . This is a picture of trix, he's a border collie.</span>
    </a>
    </li>
      <li>
    <a href="#">
    <img src="upimage/colours238.jpg" alt="A picture of colours in a swirl" />
    <span>
    <strong>
    A swirl of colours. </strong>
    This is just a picture of colours in a swirl effect.</span>
    </a>
    </li>
      </ul>
    </div>

    Sorry can't do this at the moment.
    I've decided to switch to the JQuery Lightbox Image Gallery instead. In IE8 I get the following message:
    Message: Script error
    Line: 0
    Char: 0
    Code: 0
    URI: file:///C:/Documents%20and%20Settings/User/My%20Documents/SRC12-13/all%20html%205/all%20ht ml%205/Simple-HTML-5-Template/Simple%20HTML%205%20Template/js/jquery.lightbox-0.5.min.js
    My page works and my js is refenced correctly. Not sure if this is just a IE8 thing, or whether the page needs uploading to work correctly. Works fine in Chrome.
    Wonder if there is a way to fix this?

  • Help with scrolling images/text

    I have created a web site already and know how to add
    scrolling text to my site, however I can't figure out how to insert
    images into my scrolling text. Can any one help?
    Thank you!

    It sounds like these items are on the Master page, in which case you need to go to the master page to edit them or move them. You can release them from the Master and bring them on to the current page by using Shift-Command and clikking on the object.
    It is also possible they could be on a locked layer. Check your Layers palette.

  • Need help with inserting frame with scrolling images

    Hi,
        Im a beginner and need help putting a single box/frame with scrolling images in the middle of my layout, so that when viewed in browser, the header and footer remain in place, while the images and info in the frame in the centre of the page can be scrolled down/up?

    You can use an iframe element <iframe src="" width="" height="" scrolling="yes"> though if you're concerned with crawlers you should avoid frames as much as possible. 

  • Newbie Scrolling Image Gallery

    can someone help me figure out why my site isn't loading an
    external image gallery? the tutorial i used can be found here:
    http://www.oman3d.com/tutorials/flash/imagegallery/
    they made the image gallery is completely done with
    actionscript and it works in the .swf for the gallery, but as soon
    as i call it to be loaded into the home .swf it doesn't work.
    here's the link to the sites homepage:
    (oh and dont worry i know the pics are pixelated and some
    things need fixed, i'm just trying to get the site working first)
    http://lightboy101.110mb.com/bootleg/Splash.swf
    --- here is the gallery----
    http://lightboy101.110mb.com/bootleg/Gallery.swf
    if anyone can help me, please let me know. or if you know a
    tutorial with a better scrolling image gallery, that would be
    great. thanks.

    awesome! thanks! but now i seem to have another problem... =/
    the far left and far right images are cut off. it's as if the
    gallery width is being set to the stage of the entire site, and not
    the gallery.swf height/width. i think it has something to do with
    this code:
    myThumb_mc._x = (i-1)*myThumb_mc._width;
    myThumb_mc._y = (Stage.height-myThumb_mc._height)/2;
    and
    large_mc._x = (Stage.width-large_mc._width)/2;
    large_mc._y = (Stage.height-large_mc._height)/2;

  • Help with scrolling thumbnails photogallery

    i need some help with this photo gallery im working on. im pretty sure i have almost everything correct but for some reason i cant get the thumbnails when clicked to link up with the img. i want it to show.
    well i cant really upload the file here i just found out so i can email it to whoever leaves there email
    if someone could take a look at the file and tell me what im doing wrong that would be so helpful ive been working on it for the past 2 days trying to fig. out whats wrong searching everywhere and i just cant fig. it out.
    thanks for the help

    Please don't duplicate postings.

  • Scrolling image gallery problems

    I am creating a scrolling image gallery using thumbnails.  I have 36 thumbnails that are 100 x 100 px.  I cannot figure out the x y coordinates to line up the images correctly.  They are overlapping.  I've put in the first x coordinate at 0 and the first image goes to the left, and that is fine, it is when I click the last image to put in a number, which I thought would be 36 x 100, they do not line up, they over lap.  Does anyone have a clue how to fix this?  I am working on this site for a very pushy client who wants it done NOW...Thanks,

    If you crerate a Sprite or Movieclip 3600 x 100 you can place then one after another on that container then you only have 1 object to place and scroll.

  • Hi, I need help with scrolling

    Hello I am Kevin Jin, I am working a huge project acually not that big, but I need help with five things, i mihgt have more things in my mind but here it is
    1. I need help with scrolling like where you have buttons for example or press on a navigation bar tab, then it goes to that specific pace of the page, for a one page website, for example some sites you press on contacts and gose down to the bottom of the page where the contacts place is located, not opening a new link.
    2.Second also I need help with navigation bar, where it fallows the scroll as it gose down, like for example when it is html the object is fixed to the top, and when you scroll down it will fallow it it,
    3.I need Parallex scrolling where you can have the timeline or animations run while you scroll in the meantime and have animation running all the time, for example the infographic site where the bees are fluying but still have seperate animations while you scroll
    4.I am so sorry i have two more to go, i appreciate your help, I would also like to ask if like looping each animations sperately, not looping the whole timeline, can it be possible to loop an animation while you have all the interactivity witht he site like looping seperately all the time, without interfeering with all the other animation
    5.I also are wondering if you can create multiple pages on one animate project, like multiple pages with html
    I just moved on to edge animate from html, and html was also beirf learn for me and mostly i was doing design work, and i thought getting out of graphic river and moving on the theme forest would be a better idea for me, thank you guys so much of the help and add me on skype : kevin2019170 or add me on facebook ; [email protected] or graphicriver, www.graphicriver.net/user/phantomore I would appriciate if you just would like contact me through SNS since I have that in hany 24 hours long, but the thred will also do, thank you doo much foryour help,
    P.S, I want also all the five things to work on one aimate project not interfeering with other ideas liek all five questions i had should run on one site,
    THANK YOU SO MUCH FOR YOUR HELP AND I APPRICIATE YOUR HELP!

    1.
    write this code in your button Click
    $('html,body').animate({scrollTop: sym.$("Your Symbole Name Here").offset().top}, "slow"); // scroll to the top of that symbol name
    Or :
    $('html,body').animate({"scrollTop":"600px"}, 750); // Higher value means slower , scroll to top page
    1 and 2 see this post http://forums.adobe.com/message/5531344#5531344
    3 use edge commons plugin http://www.edgedocks.com/edgecommons
    4.just put the animations behind eachother so when 1 is done, start with the animating the other symbol/div
    5. i thin its best just to make for every page a new project or make the site in muse.

  • Need help with flash images

    i have been all over forums asking this question. i hope someone helps me here.
    okay i purchased a template to make a website for a book.
    in the unedited purchased template, on the products page, there is an image gallery.
    there are four thumbnails that are just default for the template.
    when i open flash cs4, and open the library panel, and scroll to where these thumbnails are located, i am having trouble replacing the images with my own.
    i use photoshop to resize my images to the EXACT same size as the images that came with the template.
    okay. i double click the thumbnail in the library and a window pops up that shows the thumbnail with buttons like update, import, etc.
    well i click "import" so that i can replace the image with my own.
    it seems to work at first. BUT....
    when i click "save" in cs4 and then test movie and go to the products page, it was there and replaced, but it all acted CRAZY!! like the image would jump to the other thumbnails, or it would blink in and out and sometimes it would effect the entire template!!! what am i doing wrong? how can replace those thumbnails with my own and have it work correctly?
    here is the link:
    http://www.charrleslieministries.com/projects/main_v8.html    then click on the products button. thanks for any help.     michael

    it's not likely you're going to get much help in a forum.  you're problem is related to the specifics of your template and you probably don't understand how the template works.
    you're best bet is to see if you can get someone to download your fla and fix it for you.

  • URGENT! Need help with scrolling on a JPanel!

    Hello Guys! I guess there has been many postings about this subject in the forum, but the postings I found there.... still couldn't solve my problem...
    So, straight to the problem:
    I am drawing some primitive graphic on a JPanel. This JPanel is then placed in a JScrollPane. When running the code, the scrollbars are showing and the graphic is painted nicely. But when I try to scroll to see the parts of the graphics not visible in the current scrollbarview, nothing else than some flickering is happening... No movement what so ever...
    What on earth must I do to activate the scroll functionality on my JPanel??? Please Help!
    And yes, I have tried implementing the 'Scrollable' interface... But it did not make any difference...
    Code snippets:
    import java.awt.*;
    import java.awt.event.*;
    import java.awt.image.*;
    import java.awt.geom.*;
    import javax.swing.*;
    import javax.swing.event.*;
    import javax.swing.tree.*;
    import java.util.*;
    public class FilterComp extends JPanel {//implements Scrollable {
      protected DefaultMutableTreeNode root;
      protected Image buffer;
      protected int lastW = 0;
      protected int origoX = 0;
      protected final StringBuffer sb = new StringBuffer();
    //  protected int maxUnitIncrement = 1;
      protected JScrollPane scrollpane = new JScrollPane();
       *  Constructor for the FilterComp object
       *@param  scrollpane  Description of the Parameter
      public FilterComp(JScrollPane scrollpane) {
        super();
    //    setPreferredSize(new Dimension(1000, 500));
        this.setBackground(Color.magenta);
    //    setOpaque(false);
        setLayout(
          new BorderLayout() {
            public Dimension preferredLayoutSize(Container cont) {
              return new Dimension(1000, 600);
        this.scrollpane = scrollpane;
        scrollpane.setHorizontalScrollBarPolicy(JScrollPane.HORIZONTAL_SCROLLBAR_AS_NEEDED);
        scrollpane.setVerticalScrollBarPolicy(JScrollPane.VERTICAL_SCROLLBAR_ALWAYS);
        scrollpane.setPreferredSize( new Dimension( 500, 500 ) );
        scrollpane.getViewport().add( this, null );
    //    scrollpane.getViewport().setScrollMode(JViewport.SIMPLE_SCROLL_MODE);
        repaint();
      public void paintComponent(Graphics g) {
        super.paintComponent(g);
        int w = getSize().width;
        if (w != lastW) {
          buffer = null;
        Graphics2D g2 = (Graphics2D) g;
        g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
        if (root != null) {
          int h = getHeight(root);
          if (buffer == null) {
            buffer = new BufferedImage(getWidth(), getHeight(), BufferedImage.TYPE_INT_ARGB);
            Graphics2D g3 = (Graphics2D) buffer.getGraphics();
            g3.setRenderingHint(RenderingHints.KEY_ANTIALIASING, RenderingHints.VALUE_ANTIALIAS_ON);
            g3.setColor(Color.black);
            g3.setStroke(new BasicStroke(2));
            paint(g3, (w / 2) + origoX, 10, w / 2, root); 
          lastW = w;
          AffineTransform old = g2.getTransform();
          AffineTransform trans = new AffineTransform();
          trans.translate((w / 2) + origoX, (getHeight() - (h * 40)) / 2);
          g2.setTransform(trans);
          g2.drawImage(buffer, (-w / 2) + origoX, 0, null);
          g2.setTransform(old);
        updateUI();
       *  Description of the Method
       *@param  g  Description of the Parameter
      public void update(Graphics g) {
        // Call paint to reduce flickering
        paint(g);
       *  Description of the Method
       *@param  g2    Description of the Parameter
       *@param  x     Description of the Parameter
       *@param  y     Description of the Parameter
       *@param  w     Description of the Parameter
       *@param  node  Description of the Parameter
      private void paint(Graphics2D g2, int x, int y, int w, DefaultMutableTreeNode node) {
        if (node.getChildCount() == 2) {
          DefaultMutableTreeNode c1 = (DefaultMutableTreeNode) node.getChildAt(0);
          DefaultMutableTreeNode c2 = (DefaultMutableTreeNode) node.getChildAt(1);
          if (c1.getChildCount() == 0 && c2.getChildCount() == 0) {
            String s = c1.getUserObject().toString() + " " + node.getUserObject() + " " + c2.getUserObject();
            paint(g2, x, y, s);
          } else {
            g2.drawLine(x - (w / 2), y, x + (w / 2), y);
            Font f = g2.getFont();
            g2.setFont(new Font(f.getName(), Font.BOLD | Font.ITALIC, f.getSize() + 2));
            paint(g2, x, y, node.getUserObject().toString());
            g2.setFont(f);
            g2.drawLine(x - (w / 2), y, x - (w / 2), y + 40);
            g2.drawLine(x + (w / 2), y, x + (w / 2), y + 40);
            paint(g2, x - (w / 2), y + 40, w / 2, c1);
            paint(g2, x + (w / 2), y + 40, w / 2, c2);
        } else if (node.getChildCount() == 0) {
          paint(g2, x, y, node.getUserObject().toString());
       *  Description of the Method
       *@param  g2  Description of the Parameter
       *@param  x   Description of the Parameter
       *@param  y   Description of the Parameter
       *@param  s   Description of the Parameter
      private void paint(Graphics2D g2, int x, int y, String s) {
        y += 10;
        StringTokenizer st = new StringTokenizer(s, "\\", false);
        if (s.indexOf("'") != -1 && st.countTokens() > 1) {
          int sh = g2.getFontMetrics().getHeight();
          while (st.hasMoreTokens()) {
            String t = st.nextToken();
            if (st.hasMoreTokens()) {
              t += "/";
            int sw = g2.getFontMetrics().stringWidth(t);
            g2.drawString(t, x - (sw / 2), y);
            y += sh;
        } else {
          int sw = g2.getFontMetrics().stringWidth(s);
          g2.drawString(s, x - (sw / 2), y);
       *  Sets the root attribute of the FilterComp object
       *@param  root  The new root value
      public void setRoot(DefaultMutableTreeNode root) {
        this.root = root;
        buffer = null;
       *  Gets the root attribute of the FilterComp object
       *@return    The root value
      public DefaultMutableTreeNode getRoot() {
        return root;
       *  Gets the height attribute of the FilterComp object
       *@param  t  Description of the Parameter
       *@return    The height value
      private int getHeight(TreeNode t) {
        int h = 1;
        int c = t.getChildCount();
        if (c > 0) {
          if (c > 1) {
            h += Math.max(getHeight(t.getChildAt(0)), getHeight(t.getChildAt(1)));
          } else {
            h += getHeight(t.getChildAt(0));
        return h;
       *  Sets the x attribute of the FilterComp object
       *@param  x  The new x value
      public void setX(int x) {
        origoX = x;
       *  Gets the x attribute of the FilterComp object
       *@return    The x value
      public int getX() {
        return origoX;
       *  Gets the preferredScrollableViewportSize attribute of the FilterComp
       *  object
       *@return    The preferredScrollableViewportSize value
    //  public Dimension getPreferredScrollableViewportSize() {
    //    return getPreferredSize();
       *  Gets the scrollableBlockIncrement attribute of the FilterComp object
       *@param  r            Description of the Parameter
       *@param  orientation  Description of the Parameter
       *@param  direction    Description of the Parameter
       *@return              The scrollableBlockIncrement value
    //  public int getScrollableBlockIncrement(Rectangle r, int orientation, int direction) {
    //    return 10;
       *  Gets the scrollableTracksViewportHeight attribute of the FilterComp object
       *@return    The scrollableTracksViewportHeight value
    //  public boolean getScrollableTracksViewportHeight() {
    //    return false;
       *  Gets the scrollableTracksViewportWidth attribute of the FilterComp object
       *@return    The scrollableTracksViewportWidth value
    //  public boolean getScrollableTracksViewportWidth() {
    //    return false;
       *  Gets the scrollableUnitIncrement attribute of the FilterComp object
       *@param  r            Description of the Parameter
       *@param  orientation  Description of the Parameter
       *@param  direction    Description of the Parameter
       *@return              The scrollableUnitIncrement value
    //  public int getScrollableUnitIncrement(Rectangle r, int orientation, int direction) {
    //    return 10;
    }

    The Scrollable interface should be implemented by a JPanel set as the JScrollPane's viewport or scrolling may not function. Although it is said to be only necessary for tables, lists, and trees, without it I have never had success with images. Even the Java Swing Tutorial on scrolling images with JScrollPane uses the Scrollable interface.
    I donot know what you are doing wrong here, but I use JScrollPane with a JPanel implementing Scrollable interface and it works very well scrolling images drawn into the JPanel.
    You can scroll using other components, such as the JScrollBar or even by using a MouseListener/MouseMotionListener combination, but this is all done behind the scenes with the use of JScrollPane/Scrollable combination.
    You could try this approach using an ImageIcon within a JLabel:
    import java.awt.*;
    import java.awt.event.*;
    import java.awt.image.*;
    import javax.swing.*;
    import javax.swing.event.*;
    public class Test extends JFrame {
         BufferedImage bi;
         Graphics2D g_bi;
         public Test() {
              super("Scroll Test");
              makeImage();
              Container contentPane = getContentPane();
              MyView view = new MyView(new ImageIcon(bi));
              JScrollPane sp = new JScrollPane(view);
              contentPane.add(sp);
              setSize(200, 200);
              setVisible(true);
         private void makeImage() {
              bi = new BufferedImage(320, 240, BufferedImage.TYPE_INT_ARGB);
              g_bi = bi.createGraphics();
              g_bi.setColor(Color.white);
              g_bi.fillRect(0,0,320,240);
              g_bi.setColor(Color.black);
              g_bi.drawLine(0,0,320,240);
         public static void main(String args[]) {
              Test test = new Test();
    class MyView extends JLabel {
         ImageIcon icon;
         public MyView(ImageIcon ii) {
              super(ii);
              icon = ii;
         public void paintComponent(Graphics g) {
              g.drawImage(icon.getImage(),0,0,this);
    }Robert Templeton

  • Help with unloading images AS3

    Please can anyone help me. I am new to Action Script and flash and am having a nightmare unloading images. The code below works but I keep getting the following error messages:
    TypeError: Error #2007: Parameter child must be non-null.
    at flash.display::DisplayObjectContainer/removeChild()
    at index_fla::MainTimeline/clickSection()
    ArgumentError: Error #2025: The supplied DisplayObject must be a child of the caller.
    at flash.display::DisplayObjectContainer/removeChild()
    at index_fla::MainTimeline/clickSection()
    Any help with this would be much appreciated.
    var ImgReq01:URLRequest=new URLRequest("images/home/01.jpg");
    var ImgReq02:URLRequest=new URLRequest("images/home/02.jpg");
    var ImgReq03:URLRequest=new URLRequest("images/home/03.jpg");
    var ImgReq04:URLRequest=new URLRequest("images/home/04.jpg");
    var ImgReq05:URLRequest=new URLRequest("images/home/05.jpg");
    var imgList:Array=[ImgReq01,ImgReq02,ImgReq03,ImgReq04,ImgReq05];
    var imgRandom = imgList[Math.floor(Math.random()* imgList.length)];
    var imgLoader:Loader = new Loader();
    imgLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);
    imgLoader.load(imgRandom);
    function onComplete(event:Event):void
      var randomImage:Bitmap = Bitmap(imgLoader.content);
      randomImage.x=187.4;
      randomImage.y=218.1;
      addChild(randomImage);
    //handle events for info buttons...
    information. addEventListener (MouseEvent.CLICK, clickSection);
    home. addEventListener (MouseEvent.CLICK, clickSection);
    galleries. addEventListener (MouseEvent.CLICK, clickSection);
    function clickSection (evtObj:MouseEvent) {
    //Trace shows what's happening.. in the output window
    trace ("The "+evtObj.target.name+" button was clicked")
    //go to the section clicked on...
    gotoAndStop (evtObj.target.name)
    // this line is causing errors when navigating between the gallery and information buttons
    var Image:Bitmap = Bitmap(imgLoader.content);
      removeChild(Image);

    you really should be adding the loader to the displaylist, not the content.
    try:
    var ImgReq01:URLRequest=new URLRequest("images/home/01.jpg");
    var ImgReq02:URLRequest=new URLRequest("images/home/02.jpg");
    var ImgReq03:URLRequest=new URLRequest("images/home/03.jpg");
    var ImgReq04:URLRequest=new URLRequest("images/home/04.jpg");
    var ImgReq05:URLRequest=new URLRequest("images/home/05.jpg");
    var imgList:Array=[ImgReq01,ImgReq02,ImgReq03,ImgReq04,ImgReq05];
    var imgRandom = imgList[Math.floor(Math.random()* imgList.length)];
    var imgLoader:Loader = new Loader();
    imgLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);
    imgLoader.load(imgRandom);
    function onComplete(event:Event):void
    imgLoader.x=187.4;
    imgLoader.y=218.1;
      addChild(imgLoader);
    //handle events for info buttons...
    information. addEventListener (MouseEvent.CLICK, clickSection);
    home. addEventListener (MouseEvent.CLICK, clickSection);
    galleries. addEventListener (MouseEvent.CLICK, clickSection);
    function clickSection (evtObj:MouseEvent) {
    //Trace shows what's happening.. in the output window
    trace ("The "+evtObj.target.name+" button was clicked")
    //go to the section clicked on...
    gotoAndStop (evtObj.target.name)
    // this line is causing errors when navigating between the gallery and information buttons
    if(this.contains(imgLoader){
      removeChild(imgLoader);

  • Making a scrolling image gallery?

    hello,
    I am just learning HTML and am stuck. I have been trying to make an image gallery that will scroll horizontally, however all my images keep stacking vertically they do not scroll and they don't remain "hidden" I have my images in a div tag and its styled, I've copied some script from the net as well to make them auto scroll...  and they still do the same thing no matter what I try. What am I missing?

    jQuery Smooth Div Scroll - smooth content scrolling jQuery plugin - Thomas Kahn
    that is where I got this code from
    this is what my page looks like
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Home</title>
    <link href="maincss.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    #apDiv2 {
        position:absolute;
        width:58px;
        height:39px;
        z-index:600;
        left: 31px;
        top: 10px;
    #scrollable div.scollablearea {
        position:relative;
        disply:block;
        float:left;
        margin:0;
        padding:0;
    h3 {
        word-spacing: 100px;
    </style>
    <script type="text/javascript">
        $(document).ready(function (){
            $("#makemescrollable").smoothdivscroll({
                mousewheelscrolling: "alldirections", manualcontinuousscrolling: true, autoscrollingmode: "onstart"
        </script>
    </head>
    <body>
    <div class="container">
        <div class="header">Clarendon Miller Community Archives<br />
      </div>
    <div class="sidebar1" id="menu">
            <ul>
          <li><a href="index.html">Home</a></li>
          <li><a href="about.html">About</a></li>
        <li><a href="documents.html">Documents</a></li>
          <li id="menu"><a href="">Photos</a>
              <ul>
                <li><a href="plevna.html">Plevna</a></li>
                <li><a href="ompah.html">Ompah</a></li>
                <li><a href="ardoch.html">Ardoch</a></li>
                <li><a href="fernleigh.html">Fernleigh</a></li>
                <li><a href-="snow road.html">Snow Road</a></li>
            </ul>
              </li>
            <li><a href="books.html">Books</a></li>
                 <li><a href="">Events</a>
                 <ul>
                 <li><a href="pastevents.html">Past Events</a></li>
                 <li><a hfref="futureevents.html">Future Events</a></li>
                 </ul>
                 </li>   
        </ul>
        </div>
      <div class="content">
        <h2>Churches</h2>
        <h4>Holy Trinity Anglican Church</h4>
    <h6>History-</h6>
        <h6>Gallery-</h6>
        <div id="scrollable">
        <img src="image/plevna/church/anglican/holytrinityoutside1small.jpg" alt="holy trinity plevna" id="holytrinity6"/>
       <img src="image/plevna/church/anglican/holytrinityoutside2small.jpg" alt="holy trinity plevna" id="holytrinity7"/>
       <img src="image/plevna/church/anglican/holytrinityoutside3small.jpg" alt="holy trinity plevna" id="holytrinity8"/>
       <img src="image/plevna/church/anglican/holytrinityplevnamiddle.jpg" alt="holy trinity plevna" id="holytrinity9"/>
       <img src="image/plevna/church/anglican/holytrinityplevnamiddle.jpg" alt="holy trinity plevna" id="holytrinity9"/>
       <img src="image/plevna/church/anglican/holytrinityplevnamiddle.jpg" alt="holy trinity plevna" id="holytrinity9"/>
       <img src="image/plevna/church/anglican/holytrinityplevnamiddle.jpg" alt="holy trinity plevna" id="holytrinity9"/>
       <img src="image/plevna/church/anglican/holytrinityplevnamiddle.jpg" alt="holy trinity plevna" id="holytrinity10"/>
       </div>
        <h4>Plevna United Church</h4>
        <h6>History-</h6>
        <h6>Gallery-</h6>
    </div>
      <div class="footer">
        <p> KFPL  <span class="justifyrt"> in partnership with Township of North Frontinac</span></p>
        <div id="apDiv2"><img src="kfpl.jpg" width="57" height="36" id="Image2" /></div>
      </div>
    </div>
    </body>
    </html>

  • Help with unloading images

    Please can anyone help me. I am new to Action Script and flash and am having a nightmare unloading images. The code below works but I keep getting the following error messages:
    TypeError: Error #2007: Parameter child must be non-null.
    at flash.display::DisplayObjectContainer/removeChild()
    at index_fla::MainTimeline/clickSection()
    ArgumentError: Error #2025: The supplied DisplayObject must be a child of the caller.
    at flash.display::DisplayObjectContainer/removeChild()
    at index_fla::MainTimeline/clickSection()
    Any help with this would be much appreciated.
    var ImgReq01:URLRequest=new URLRequest("images/home/01.jpg");
    var ImgReq02:URLRequest=new URLRequest("images/home/02.jpg");
    var ImgReq03:URLRequest=new URLRequest("images/home/03.jpg");
    var ImgReq04:URLRequest=new URLRequest("images/home/04.jpg");
    var ImgReq05:URLRequest=new URLRequest("images/home/05.jpg");
    var imgList:Array=[ImgReq01,ImgReq02,ImgReq03,ImgReq04,ImgReq05];
    var imgRandom = imgList[Math.floor(Math.random()* imgList.length)];
    var imgLoader:Loader = new Loader();
    imgLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);
    imgLoader.load(imgRandom);
    function onComplete(event:Event):void
      var randomImage:Bitmap = Bitmap(imgLoader.content);
      randomImage.x=187.4;
      randomImage.y=218.1;
      addChild(randomImage);
    //handle events for info buttons...
    information. addEventListener (MouseEvent.CLICK, clickSection);
    home. addEventListener (MouseEvent.CLICK, clickSection);
    galleries. addEventListener (MouseEvent.CLICK, clickSection);
    function clickSection (evtObj:MouseEvent) {
    //Trace shows what's happening.. in the output window
    trace ("The "+evtObj.target.name+" button was clicked")
    //go to the section clicked on...
    gotoAndStop (evtObj.target.name)
    // this line is causing errors when navigating between the gallery and information buttons
    var Image:Bitmap = Bitmap(imgLoader.content);
      removeChild(Image);

    you really should be adding the loader to the displaylist, not the content.
    try:
    var ImgReq01:URLRequest=new URLRequest("images/home/01.jpg");
    var ImgReq02:URLRequest=new URLRequest("images/home/02.jpg");
    var ImgReq03:URLRequest=new URLRequest("images/home/03.jpg");
    var ImgReq04:URLRequest=new URLRequest("images/home/04.jpg");
    var ImgReq05:URLRequest=new URLRequest("images/home/05.jpg");
    var imgList:Array=[ImgReq01,ImgReq02,ImgReq03,ImgReq04,ImgReq05];
    var imgRandom = imgList[Math.floor(Math.random()* imgList.length)];
    var imgLoader:Loader = new Loader();
    imgLoader.contentLoaderInfo.addEventListener(Event.COMPLETE, onComplete);
    imgLoader.load(imgRandom);
    function onComplete(event:Event):void
    imgLoader.x=187.4;
    imgLoader.y=218.1;
      addChild(imgLoader);
    //handle events for info buttons...
    information. addEventListener (MouseEvent.CLICK, clickSection);
    home. addEventListener (MouseEvent.CLICK, clickSection);
    galleries. addEventListener (MouseEvent.CLICK, clickSection);
    function clickSection (evtObj:MouseEvent) {
    //Trace shows what's happening.. in the output window
    trace ("The "+evtObj.target.name+" button was clicked")
    //go to the section clicked on...
    gotoAndStop (evtObj.target.name)
    // this line is causing errors when navigating between the gallery and information buttons
    if(this.contains(imgLoader){
      removeChild(imgLoader);

  • Action Script problem with scrolling images

    doing a tutorial and got to the stage of action scripting mouse control for scrolling images.
    checked the script in Actions. And said it was ok...No errors found.
    Tested the movie and there were 2 compiler errors reported.
    Scene 1. layer 'action script', Frame 1, line 1: 1120:Access of undefined property _root. _root.onEnterFrame=funtion(){
    Scene 1. layer 'action script', Frame 1, line 2: 1120:Access of undefined property _root. _if(_root._xmouse<50){
    Scene 1. layer 'action script', Frame 1, line 1: Warning: 1058: Migration issue: The property _root.onEnterFrame=funtion(){
    Can anyone help me understand this.
    thanks

    It sounds like you are mixing up AS2 code with AS3 compiling.  You may need to change you publish settings to AS2.

Maybe you are looking for