Dock Menu With jquery

Hi,
i am new with jQuery.How work with Jquery.
i am using Apex 3.2 Ver.
if you have any demmy applicatyion with code .please refer me.
i want to creted an Dock menu Using jquery in apex 3.2.
How can i do this.
Thanks
Edited by: 805629 on Mar 29, 2011 4:40 AM

Hi Vee,
Actully today i have see this link .
http://actionet.homelinux.net/htmldb/f?p=100:52:2145432616736079::NO:::
So i want to use jquery to improve my applicaion Standard.But i don't use jquery before so i need some tutorials how to use jquery in apex in 3.2 Ver .
How can i do this.
Thanks

Similar Messages

  • Can't get index of spry select menu with JQuery?

    If I do this with a regular (non-dynamic) select menu:
    $('.bogus').change(function(e){
              var i = e.currentTarget.selectedIndex;
              //alert(i);
              ds1.setCurrentRowNumber(i);
    It works. The detail region updates.
    But if I try it with a spry menu, nothing. No event is captured at all.
      <select class="bogus" spry:repeatchildren="ds1" size="10">
                  <option>{name}</option>
        </select>

    If I do this with a regular (non-dynamic) select menu:
    $('.bogus').change(function(e){
              var i = e.currentTarget.selectedIndex;
              //alert(i);
              ds1.setCurrentRowNumber(i);
    It works. The detail region updates.
    But if I try it with a spry menu, nothing. No event is captured at all.
      <select class="bogus" spry:repeatchildren="ds1" size="10">
                  <option>{name}</option>
        </select>

  • Problem with jquery slide show conflict with vertical navigation menu in Firefox & Chrome

    Problem with jquery slide show conflict with vertical navigation menu in Firefox & Chrome. Works in IE. This is my first time trying to post a question - so please be kind. I am also not good with code and am finding css a real challenge after learning to design based on tables. I'm using CS5.
    The "test" page with the slide show is: http://www.reardanwa.com/index-slides.html   The same page without the slide show is http://www.reardanwa.com/
    I realize the images are not ideally sized - I'll fix those once I get the pages to function.  Maybe I need a different slide show? I would prefer a widget that I can modify to required size & postition. Again - I'm not good at building with code from scratch.
    The problem is the naviagation links that are directly next to the slide show do not work in Firefox of Chrome. They do work in IE.
    I've read about using jQuery.noConflict(); code but can't figure out the correct way to use it in my case or whether that's even part of the solution. I know my code is not well organized as I have cobbled together from various sources in an attempt to format the page the way the client wants it. Also, FYI, I will eventually try to make the page work in Surreal CMS.
    I've spent sevaral days over the last several weeks trying to solve sth slide show/navigation conflict - so any specific light you can shed will be much appreciated.
    Thanks in advance.
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Reardan Area Chamber of Commerce</title>
    <meta name="description" content="home page for Reardan Area Chamber of Commerce" />
    <meta name="keywords" content="Reardan WA, chamber of commerce" </>
    <script src="scripts/jquery-1.6.min.js" type="text/javascript"></script>
    <script src="scripts/jquery.cycle.all.js" type="text/javascript">  </script>
    <script type="text/xml">
    </script>
    <style type="text/css">
                                  #slideshow { 
                                      padding: 10px;
                                            margin:0; 
                                  #slideshow-caption{
                                            padding:0;
                                            margin:0;
                                  #slideshow img, #slideshow div { 
                                      padding: 10px;
                                      background-color: #EEE;
                                      margin: 0;
    body {
              font: 100%/1.4 Verdana, Arial, Helvetica, sans-serif;
              background: #004B8D;
              margin: 0;
              padding: 0;
              color: #000;
    /* ~~ Element/tag selectors ~~ */
    ul, ol, dl { /* Due to variations between browsers, it's best practices to zero padding and margin on lists. For consistency, you can either specify the amounts you want here, or on the list items (LI, DT, DD) they contain. Remember that what you do here will cascade to the .nav list unless you write a more specific selector. */
              padding: 0;
              margin: 0;
    h1, h2, h3, h4, h5, h6, p {
              margin-top: 0;           /* removing the top margin gets around an issue where margins can escape from their containing div. The remaining bottom margin will hold it away from any elements that follow. */
               /* adding the padding to the sides of the elements within the divs, instead of the divs themselves, gets rid of any box model math. A nested div with side padding can also be used as an alternate method. */
    .left
    position:absolute;
    left:0px;
    .center
    margin:auto;
    width:95%;
    .box
              position:relative;
              left:-90px;
              width:950px;
              height:350px;
              border-radius: 13px;
        -moz-border-radius: 13px;
        -webkit-border-radius: 13px;
              z-index:1000;
    .slide{
        position:absolute;
    a img { /* this selector removes the default blue border displayed in some browsers around an image when it is surrounded by a link */
              border: none;
    /* ~~ Styling for your site's links must remain in this order - including the group of selectors that create the hover effect. ~~ */
    a:link {
              color: #42413C;
              text-decoration: underline; /* unless you style your links to look extremely unique, it's best to provide underlines for quick visual identification */
    a:visited {
              color: #6E6C64;
              text-decoration: underline;
    a:hover, a:active, a:focus { /* this group of selectors will give a keyboard navigator the same hover experience as the person using a mouse. */
              text-decoration: none;
    /* ~~this fixed width container surrounds the other divs~~ */
    .container {
              width: 960px;
              min-height:900px;
              padding:5px 0px 0px 0px;
              background: #E8F8FF;
              margin: 0 auto; /* the auto value on the sides, coupled with the width, centers the layout */
    /* ~~ the header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo ~~ */
    .header {
              background: #E8F8FF;
              padding:10px 5px 0px 5px;
    .sidebar1 {
              float: left;
              width: 225px;
              margin: 60px;
              color: #FFFF0D;
              background: #595FFF;
              border-radius: 13px;
        -moz-border-radius: 13px;
        -webkit-border-radius: 13px;
              padding: 5px 5px 0px 5px;
        border: 3px solid #F7F723;
        z-index:-1;
    .sidebar2 {
              float: left;
              width: 275px;
              color: #FFFF0D;
              text-align: left;
              background: #595FFF;
              padding-bottom: 10px;
              border-radius: 13px;
        -moz-border-radius: 13px;
        -webkit-border-radius: 13px;
        border: 3px solid #F7F723;
        z-index:2;
    .sidebar3 {
              float: left;
              width: 275px;
              color: #FFFF0D;
              text-align: left;
              background: #595FFF;
              padding-bottom: 10px;
              border-radius: 13px;
        -moz-border-radius: 13px;
        -webkit-border-radius: 13px;
        border: 3px solid #F7F723;
        z-index:3;
    .content {
              padding: 0px 0px 0px 0px;
              width: 780px;
              float: left;
              background: #E8F8FF;
    /* ~~ This grouped selector gives the lists in the .content area space ~~ */
    .content ul, .content ol {
              padding: 0px 15px 5px 10px; /* this padding mirrors the right padding in the headings and paragraph rule above. Padding was placed on the bottom for space between other elements on the lists and on the left to create the indention. These may be adjusted as you wish. */
    /* ~~ The navigation list styles (can be removed if you choose to use a premade flyout menu like Spry) ~~ */
    ul.nav {
              list-style: none; /* this removes the list marker */
              border-top: 0px solid #FFFF66; /* this creates the top border for the links - all others are placed using a bottom border on the LI */
              margin-bottom: 50px; /* this creates the space between the navigation on the content below */
              font: Arial Black, Verdana, , Helvetica, sans-serif;
              font-size:1.3em;
              font-weight:bold;
              z-index:2;
    ul.nav li {
              border-bottom: 0px solid #FFFF66; /* this creates the button separation */
              font: 120%/1.4 Arial Black, Verdana, , Helvetica, sans-serif;
    ul.nav a, ul.nav a:visited { /* grouping these selectors makes sure that your links retain their button look even after being visited */
              padding: 3px 0px 5px 0px;
              display: block; /* this gives the link block properties causing it to fill the whole LI containing it. This causes the entire area to react to a mouse click. */
              width: 185px;  /*this width makes the entire button clickable for IE6. If you don't need to support IE6, it can be removed. Calculate the proper width by subtracting the padding on this link from the width of your sidebar container. */
              text-decoration: none;
              color: #FFFF0D;
              background: #595FFF;
    ul.nav a:hover, ul.nav a:active, ul.nav a:focus { /* this changes the background and text color for both mouse and keyboard navigators */
              background: #595FFF;
              font: 120%/1.4 Arial Black, Verdana, , Helvetica, sans-serif;
              color: #FFFFFF;
    /* ~~ The footer ~~ */
    .footer {
              padding: 10px 0;
              background:  #595FFF;
              color: #FFFF0D;
              position: relative;/* this gives IE6 hasLayout to properly clear */
              clear: both; /* this clear property forces the .container to understand where the columns end and contain them */
    /* ~~ miscellaneous float/clear classes ~~ */
    .fltrt {  /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
              float: right;
              margin-left: 8px;
    .fltlft { /* this class can be used to float an element left in your page. The floated element must precede the element it should be next to on the page. */
              float: left;
              margin-right: 8px;
    .clearfloat { /* this class can be placed on a <br /> or empty div as the final element following the last floated div (within the #container) if the #footer is removed or taken out of the #container */
              clear:both;
              height:0;
              font-size: 1px;
              line-height: 0px;
    -->
    </style>
    </head>
    <body>
    <div class="container">
      <div class="header"><!-- end .header -->
      <a href="#"><img src="images/Chamber-Logo-2.gif" alt="Reardan Chamber Logo" width="187" height="163" hspace="10" vspace="5" align="top" /></a><img src="images/Reardan-Chamber-Title.gif" width="476" height="204" alt="Reardan Area Chamber of Commerce, Dedicated to Preserving and Enhancing Area Businesses" /><p></p>
      <p style="color: #F00">This Site is under construction! Please pardon our dust as we create!</p>
      </div>
      <div class="sidebar1">
        <ul class="nav">
          <li><a href="about.html">About Us</a></li>
          <li><a href="history.html">Reardan History</a></li>
          <li><a href="activities.html">Activities</a></li>
          <li><a href="business.html">Business<br />
            Directory</a></li>
          <li><a href="about.html">Join the<br />
            Chamber</a></li>
           <li><a href="links.html">Links<br />
      <span style="font-size: 85%">Tourism</span><br />
          </a></li>
        </ul>
         <!-- end .sidebar1 --></div>
    <br />
    <br />
    <br />
    <br />
    <div class="box" +"slide">
      <script type="text/javascript">
    // BeginOAWidget_Instance_2559022: #slideshow
                               slideshowAddCaption=true;
    $(window).load(function() {
      $('#slideshow').cycle({
                        after:                              slideshowOnCycleAfter, //the function that is triggered after each transition
                        autostop:                              false,     // true to end slideshow after X transitions (where X == slide count)
                        fx:                                        'blindX',// name of transition effect
                        pause:                              false,     // true to enable pause on hover
                        randomizeEffects:          true,  // valid when multiple effects are used; true to make the effect sequence random
                        speed:                              100,  // speed of the transition (any valid fx speed value)
                        sync:                              true,     // true if in/out transitions should occur simultaneously
                        timeout:                    5000,  // milliseconds between slide transitions (0 to disable auto advance)
                        fit:                              true,
                        height:                       '300px',
                        width:         '525px'   // container width (if the 'fit' option is true, the slides will be set to this width as well)
    function slideshowOnCycleAfter() {
              if (slideshowAddCaption==true){
                                  $('#slideshow-caption').html(this.title);
    // EndOAWidget_Instance_2559022
      </script>
      <div id="slideshow">
        <!--All elements inside this will become slides-->
        <img src="images/100_1537.jpeg" width="600" height="450" title="caption for image1" /> <img src="images/Parade-2011-2.jpg" width="300" height="225" title="caption for image2" /> <img src="images/100_1495.jpeg" width="600" height="450" title="caption for image3" />
        <div title="sample title"> Images for slide show will need to be re-sized to fit box to avoid distortion</div>
        <img src="images/beach4.jpg" width="200" height="200" title="caption for image4" /> <img src="images/beach5.jpg" width="200" height="200" title="caption for image5" /> </div>
      <!--It is safe to delete this if captions are disabled-->
      <div id="slideshow-caption"></div></div>
    <div class="sidebar2" "anotherClass editable"><p align="center"><strong>Chamber News</strong><br />
    Local News item
    <br />
    Another New item</p>
      <p align="center">lots of news this week<br />
        <br />
        <br />
        <br />
      </p>
    </div>
    <div class="sidebar3" "anotherClass editable"><p align="center"><strong>Upcoming Events</strong></p>
      <div align="center">    <a href="activities.html" style="color: #FFFF0D">Community wide yard sales</a><br />
        <br />
        <br />
        <br />
        <br />
      </div>
    </div>
    <div class="content"><br />
    <br />
    </div>
    <div class="footer">
            <p align="center"><span style="font-size: small">Reardan Area Chamber of Commerce</span><br />
              <span style="font-size: x-small">[email protected]  - 509.796.2102</span><br />
            </p>
            <!-- end .footer -->
    </div></body>
    </html>

    If you DO want the slideshow overlaping the navigation try the below css:
    .sidebar1 {
        float: left;
        width: 225px;
        margin: 60px 0px 60px 60px;
        color: #FFFF0D;
        background: #595FFF;
        border-radius: 13px;
        -moz-border-radius: 13px;
        -webkit-border-radius: 13px;
        padding: 5px 5px 0px 5px;
        border: 3px solid #F7F723;
    .box {
    float: left;
    margin-left:-60px;
    width:700px;
    height:350px;
    border-radius: 13px;
    -moz-border-radius: 13px;
    -webkit-border-radius: 13px;

  • Need help with Flash Dock Menu

    Hi guys,
    I'm trying to build a dock menu componant for my website in CS3. I've seen loads of them out there but they all seem to only stop scrolling when the mouse is moved in to the center of the movie - I want to build one exactly like the one in the link below, where the mouse will stop scrolling once the mouse is settled over the image you want to select.
    http://www.mtoolcomponents.com/flash-slideshow/flash-dock-menu.html
    I even want to create something a bit simpler where there are no reflections and the images don't get bigger on rollover.
    Does anyone know of a tutorial or know how I can achieve this?
    Thank you very much and I hope to hear from you.
    SM

    I am trying to create the menu. I have figured out how to
    create the extra button as well as where I will need to change the
    link for each button but if you download the menu from above (link
    included in previous post) you will notice that the first two
    buttons are mimicking each other. I need the second option to be
    FAQs independent of the first home button

  • How can I get to home screen from car dock menu when an app is running?

    Just upgraded to the RAZR MAXX from a Droid 2 Global.
    When the phone is mounted in the car dock and an app is running (Navi, Music, etc.), how can you get to the main home screen of the phone rather than the car dock menu?
    Follow me......
    * Phone is mounted in Car Dock.
    * If there are NO apps running, pressing the BACK key from within the Car Dock Menu takes you directly to the Home screen.
    However.....
    * Phone is mounted in Car Dock.
    * Navigation(or any app, for that matter) is running.
    * Pressing MENU key takes me to Car Dock Menu.
    * There's no exit option available to exit from car dock menu.
    * Pressing BACK key takes you back to the app that's running, not the home screen.
    * Long press of HOME key only takes you to an app list screen, not home screen.
    * Only way to get to home screen is to repeatedly press the BACK button exiting out of the Car Dock Menu and cancelling all apps that are currently running.
    On my Droid 2, I was able to quickly exit the Car Dock Menu simply by pressing the BACK or exit button, regardless of which or how many apps were running. They would still run in the background, showing on the status bar.
    Anyone know of a work around? I couldn't find any settings to change within the Car Dock menu to change this. Stopped by three Verizon stores and they all say we have to be missing something, as they couldn't figure it out either. One rep told me it was a new "nanny" feature so that you couldn't access your apps while driving, however when I pointed out that you could access the home screen if no apps were running, he wasn't sure what to say.
    Any help?

    I solved my problem eventually by getting all the devices - 2 iphones, the newish pc and the older Mac on icloud.
    All media, calenders and messages were lost from the iphones, except for purchased itunes that I paid another $30 to Apple to save for me and also paid Appple some more to use icloud but the good news is I did save my contacts
    I opened all of my contacts and pretty much had to edit and drag them over almost individually as they weren't all in some sort of configuration that Apple liked - i.e. if an email address ended in ch or es or de it might not be accepted as a properly configured vcard.
    It would be nice if Apple made it a litle easier when you have older devices and need to get them in sync with newer ones.

  • How to make thumbnails enlarge when using grid navigation effects with jquery

    I have used a grid navigation effect with jquery to display several thumbnail images but i would like the images to enlarge to a bigger size when they are clicked on, i dont want another window to open but for the image to appear on the same page like lightbox, except i dont need a gallery, just the enlarging function. Please see the code below of my page and the link to see the demo of the grid nav with jquery that i used (effect- 'rows move', example 9).
    http://tympanus.net/codrops/2011/06/09/grid-navigation-effects/comment-page-2/#comments
    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>My gallery</title>
    <link href="stylesheet.css" rel="stylesheet" type="text/css" />
    <link href="gridNavigation.css" rel="stylesheet" type="text/css" />
    <link href="reset.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    body {
              background-color: #000000;
    a:link {
              text-decoration: none;
              color:#f1d379;
    a:visited {
              text-decoration: none;
              color: #f1d379;
    a:hover {
              text-decoration: none;
              color: #9d6f1b;
    a:active {
              text-decoration: none;
              color: #f1d379;
    </style>
            <script type="text/javascript" src="scripts/jquery-1.6.1.min.js"></script>
                        <script type="text/javascript" src="scripts/jquery.easing.1.3.js"></script>
                        <script type="text/javascript" src="scripts/jquery.mousewheel.js"></script>
                        <script type="text/javascript" src="scripts/jquery.gridnav.js"></script>
    <script type="text/javascript">
    $(function() {
                                            $('#tj_container').gridnav({
                                                      type          : {
                                                          rows    : 2,
                                                                mode                    : 'rows',                               // use def | fade | seqfade | updown | sequpdown | showhide | disperse | rows
                                                                speed                    : 1000,                                        // for fade, seqfade, updown, sequpdown, showhide, disperse, rows
                                                                easing                    : 'easeInOutBack',          // for fade, seqfade, updown, sequpdown, showhide, disperse, rows
                                                                factor                    : 150,                                        // for seqfade, sequpdown, rows
                                                                reverse                    : ''                                        // for sequpdown
    </script>
    </head>
    <body>
    <div class="container" id="container">
    <div id="navbar_gallery" class="#navbar_gallery">
    <ul>
              <li><a  href="index.html">Homepage</a></li>
              <li><a  href="about_me.html" >About me</a></li>
              <li><a  href="gallery.html">Gallery</a></li>
              <li><a  href="contact.html">Contact</a></li>
      </ul>
    </div>
    <div class="maintext" id="page_maintext">
      <p class="page_heading">My Gallery</p>
    </div>
    <div class="content example5">
    <div id="tj_container" class="tj_container">
                                                      <div class="tj_nav">
                                                                <span id="tj_prev" class="tj_prev">Previous</span>
                                                                <span id="tj_next" class="tj_next">Next</span>
                                                      </div>
              <div class="tj_wrapper">
                                                                <ul class="tj_gallery">
                                                                          <li><a href="#"><img src="images/1.jpg" alt="image01" /></a></li>
                                                                          <li><a href="#"><img src="images/2.jpg" alt="image02" /></a></li>
                                                                          <li><a href="#"><img src="images/3.jpg" alt="image03" /></a></li>
                                                                          <li><a href="#"><img src="images/4.jpg" alt="image04" /></a></li>
                                                                          <li><a href="#"><img src="images/5.jpg" alt="image05" /></a></li>
                                                                          <li><a href="#"><img src="images/6.jpg" alt="image06" /></a></li>
                                                                          <li><a href="#"><img src="images/7.jpg" alt="image07" /></a></li>
                                                                          <li><a href="#"><img src="images/8.jpg" alt="image08" /></a></li>
                                                                          <li><a href="#"><img src="images/9.jpg" alt="image09" /></a></li>
                                                                          <li><a href="#"><img src="images/10.jpg" alt="image10" /></a></li>
                                                                          <li><a href="#"><img src="images/11.jpg" alt="image11" /></a></li>
                                                                          <li><a href="#"><img src="images/12.jpg" alt="image12" /></a></li>
                                                                          <li><a href="#"><img src="images/13.jpg" alt="image13" /></a></li>
                                                                          <li><a href="#"><img src="images/14.jpg" alt="image14" /></a></li>
                                                                          <li><a href="#"><img src="images/15.jpg" alt="image15" /></a></li>
                                                                          <li><a href="#"><img src="images/16.jpg" alt="image16" /></a></li>
                                                                          <li><a href="#"><img src="images/17.jpg" alt="image17" /></a></li>
                                                                          <li><a href="#"><img src="images/18.jpg" alt="image18" /></a></li>
                                                                          <li><a href="#"><img src="images/19.jpg" alt="image19" /></a></li>
                                                                          <li><a href="#"><img src="images/20.jpg" alt="image20" /></a></li>
                                                        </ul>
                </div>
      </div>
    </div>
    </body>
    </html>

    Ok so i've tried to do the above as suggested but i've obviously gone wrong somewhere as the fancybox function doesnt work, all that happens when clicking on thumbnail is the bigger version is opened in another browser window?
    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>My gallery</title>
    <link href="stylesheet.css" rel="stylesheet" type="text/css" />
    <link href="gridNavigation.css" rel="stylesheet" type="text/css" />
    <link href="reset.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="/fancybox/source/jquery.fancybox.css?v=2.1.5" type="text/css" media="screen" />
    <style type="text/css">
    body {
              background-color: #000000;
    a:link {
              text-decoration: none;
              color:#f1d379;
    a:visited {
              text-decoration: none;
              color: #f1d379;
    a:hover {
              text-decoration: none;
              color: #9d6f1b;
    a:active {
              text-decoration: none;
              color: #f1d379;
    </style>
            <script type="text/javascript" src="scripts/jquery-1.6.1.min.js"></script>
                        <script type="text/javascript" src="scripts/jquery.easing.1.3.js"></script>
                        <script type="text/javascript" src="scripts/jquery.mousewheel.js"></script>
                        <script type="text/javascript" src="scripts/jquery.gridnav.js"></script>
            <script type="text/javascript" src="/fancybox/source/jquery.fancybox.pack.js?v=2.1.5"></script>
            <script type="text/javascript">
    $(function() {
                                            $('#tj_container').gridnav({
                                                      type          : {
                                                          rows    : 2,
                                                                mode                    : 'rows',                               // use def | fade | seqfade | updown | sequpdown | showhide | disperse | rows
                                                                speed                    : 1000,                                        // for fade, seqfade, updown, sequpdown, showhide, disperse, rows
                                                                easing                    : 'easeInOutBack',          // for fade, seqfade, updown, sequpdown, showhide, disperse, rows
                                                                factor                    : 150,                                        // for seqfade, sequpdown, rows
                                                                reverse                    : ''                                        // for sequpdown
    </script>
    <script type="text/javascript">
              $(document).ready(function() {
                        $(".fancybox").fancybox();
    </script>
    <script type="text/javascript">
    $(document).ready(function() {
                  $("#single_1").fancybox({
              helpers: {
                  title : {
                      type : 'float'
        $("#single_2").fancybox({
                  openEffect          : 'elastic',
                  closeEffect          : 'elastic',
                  helpers : {
                            title : {
                                      type : 'inside'
        $("#single_3").fancybox({
                  openEffect : 'none',
                  closeEffect          : 'none',
                  helpers : {
                            title : {
                                      type : 'outside'
                   $("#single_4").fancybox({
                  helpers : {
                            title : {
                                      type : 'over'
    </script>
    </head>
    <body>
    <div class="container" id="container">
    <div id="navbar_gallery" class="#navbar_gallery">
    <ul>
              <li><a  href="index.html">Homepage</a></li>
              <li><a  href="about_me.html" >About me</a></li>
              <li><a  href="gallery.html">Gallery</a></li>
              <li><a  href="contact.html">Contact</a></li>
      </ul>
    </div>
    <div class="maintext" id="page_maintext">
      <p class="page_heading">My Gallery</p>
    </div>
    <div class="content example5">
    <div id="tj_container" class="tj_container">
                                                      <div class="tj_nav">
                                                                <span id="tj_prev" class="tj_prev">Previous</span>
                                                                <span id="tj_next" class="tj_next">Next</span>
                                                      </div>
              <div class="tj_wrapper">
                                                                <ul class="tj_gallery">
                                                                          <li><a id="single_1" href="images/1-big.jpg" title="Row of beach huts"><img src="images/1.jpg" alt="Row of beach huts" /></a>
                                                                          <li><a id="single_2" href="images/2-big.jpg" title="Bees collecting pollen"><img src="images/2.jpg" alt="Bees collecting pollen" /></a></li>
                                                                          <li><a id="single_3" href="images/3-big.jpg" title="Frank"><img src="images/3.jpg" alt="Frank" /></a>
                                                                          <li><a id="single_4" href="images/4-big.jpg" title="New zealand beach"><img src="images/4.jpg" alt="Beach" /></a></li>
                                                                          <li><a id="single_5" href="images/5-big.jpg" title="Sonning river"><img src="images/5.jpg" alt="River" /></a></li>
                                                                          <li><a id="single_6" href="images/6-big.jpg" title="Steaming post in the morning sun"><img src="images/6.jpg" alt="steaming post" /></a></li>
                                                                          <li><a id="single_7" href="images/7-big.jpg" title="Portrait lady"><img src="images/7.jpg" alt="Portrait of lady" /></a></li>
                                                                          <li><a id="single_8" href="images/8-big.jpg" title="A great day at the coast"><img src="images/8.jpg" alt="Dog running along beach" /></a></li>
                                                                          <li><a id="single_9" href="images/9-big.jpg" title="Jam hut in new zealand"><img src="images/9.jpg" alt="Jam hut in new zealand" /></a></li>
                                                                          <li><a id="single_10" href="images/10-big.jpg" title="New zealand lake"><img src="images/10.jpg" alt="new zealand lake" /></a></li>
                                                                          <li><a id="single_11" href="images/11-big.jpg" title="Full speed ahead"><img src="images/11.jpg" alt="Dog running" /></a></li>
                                                                          <li><a id="single_12" href="images/12-big.jpg" title="Portsmouth docks"><img src="images/12.jpg" alt="Portsmouth docks" /></a></li>
                                                                          <li><a href="#"><img src="images/13.jpg" alt="image13" /></a></li>
                                                                          <li><a href="#"><img src="images/14.jpg" alt="image14" /></a></li>
                                                                          <li><a href="#"><img src="images/15.jpg" alt="image15" /></a></li>
                                                                          <li><a href="#"><img src="images/16.jpg" alt="image16" /></a></li>
                                                                          <li><a href="#"><img src="images/17.jpg" alt="image17" /></a></li>
                                                                          <li><a href="#"><img src="images/18.jpg" alt="image18" /></a></li>
                                                                          <li><a href="#"><img src="images/19.jpg" alt="image19" /></a></li>
                                                                          <li><a href="#"><img src="images/20.jpg" alt="image20" /></a></li>
                                                        </ul>
                </div>
      </div>
    </div>
    </body>
    </html>

  • How to add icons in native menu with text

    Hello Guys
                     Can Anybody guides me how to add icon in nativemenu system tray.Actually i am making a simple application in adobe air and use minimizing the application into system  tray.On Right  click on the icon present in system tray it open naitive menu with open and exit option.
    i just want to add an icon with each menuItem.Please guide how can i do it.please give me some example for it.i am using this
                                     http://www.swamicharan.com/blog/air/minimizing-an-air-app-to-systemtray/
    link for dock and undock my application.And also tell me how to enhace the width of that naitive menu .please help me out.
    Thanks  And Regards
         Vineet Osho.

               the native menu means in ur application menu or flex system menu?

  • Dock Menu question

    Samsung Charge with the Samsung car dock.   Is there any way to modify the applications that appear on the dock menu?  I'd like to replace the Vz Navigator with Google Navigator.
    Any comments would be appreciated!

    And, although it is not a direct solution to your problem, you can disable the dock screen when the phone is docked.  Go to Settings/Dock Settings and set to "Never".  This will allow you to see your normal home screens even when the phone is docked.  Not an elegant solution, but it will do the job if your main home screen has the apps you want.

  • How can I add more than one same spry menu (eg. collapsible menu)  with in different styles (font size, color, background, etc) on current page?

    How can I add more than one same spry menu (eg. collapsible menu)  with in different styles (font size, color, background, etc) on current page?

    Hi Nancy,
    This screenshot was only for imagination. A part of the code (not all) is below.  In the code there are some background images but they are not seem in live mode.
    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <link href="css/my_site.css" rel="stylesheet" type="text/css" />
    <link href="SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css"/>
    <link href="SpryAssets/SpryCollapsiblePanel.css" rel="stylesheet" type="text/css" />
    <script src="SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
    <script src="SpryAssets/SpryCollapsiblePanel.js" type="text/javascript"></script>
    <style>
    #CollapsiblePanel1 .CollapsiblePanelOpen .CollapsiblePanelTab {
        background-color: #003366;
        font-size: 18px;
        line-height: 52px;
        color: #FFF;
    #CollapsiblePanel1 .CollapsiblePanelTabHover .CollapsiblePanelTab {
        background-color: #003366;
        color: #FFF;
        text-shadow: 1px 1px #000;
        font-weight: bold;
        line-height: 52px;
    #CollapsiblePanel1 .CollapsiblePanelClosed .CollapsiblePanelTab  {
        background-color: #C3CFDF;
        border-radius: 5px 5px 0px 0px;
        color: #999
        text-shadow: 1px 1px #000;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 18px;
        font-weight: bold;
        line-height: 52px;
    #CollapsiblePanel2 .CollapsiblePanelOpen .CollapsiblePanelTab {
        background-image: url(images/international.jpg);
        background-repeat: no-repeat;
        font-size: 18px;
        line-height: 52px;
        color: #FFF;
    #CollapsiblePanel2 .CollapsiblePanelTabHover .CollapsiblePanelTab {
        background-color: #003366;
        color: #FFF;
        text-shadow: 1px 1px #000;
        font-weight: bold;
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel2 .CollapsiblePanelClosed .CollapsiblePanelTab  {
        background-color: #C3CFDF;
        border-radius: 5px 5px 0px 0px;
        color: #999
        text-shadow: 1px 1px #000;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 18px;
        font-weight: bold;
        background-image: url(images/TR_Gray2-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel2 .CollapsiblePanelContent {
        background-color: blue;
    #CollapsiblePanel3 .CollapsiblePanelOpen .CollapsiblePanelTab {
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        font-size: 18px;
        line-height: 52px;
        color: #FFF;
    #CollapsiblePanel3 .CollapsiblePanelTabHover .CollapsiblePanelTab {
        background-color: #003366;
        color: #FFF;
        text-shadow: 1px 1px #000;
        font-weight: bold;
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel3 .CollapsiblePanelClosed .CollapsiblePanelTab  {
        background-color: #C3CFDF;
        border-radius: 5px 5px 0px 0px;
        color: #999
        text-shadow: 1px 1px #000;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 18px;
        font-weight: bold;
        background-image: url(images/TR_Gray2-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel4 .CollapsiblePanelOpen .CollapsiblePanelTab {
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        font-size: 18px;
        line-height: 52px;
        color: #FFF;
    #CollapsiblePanel4 .CollapsiblePanelTabHover .CollapsiblePanelTab {
        background-color: #003366;
        color: #FFF;
        text-shadow: 1px 1px #000;
        font-weight: bold;
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel4 .CollapsiblePanelClosed .CollapsiblePanelTab  {
        background-color: #C3CFDF;
        border-radius: 5px 5px 0px 0px;
        color: #999
        text-shadow: 1px 1px #000;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 18px;
        font-weight: bold;
        background-image: url(images/TR_Gray2-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel5 .CollapsiblePanelOpen .CollapsiblePanelTab {
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        font-size: 18px;
        line-height: 52px;
        color: #FFF;
    #CollapsiblePanel5 .CollapsiblePanelTabHover .CollapsiblePanelTab {
        background-color: #003366;
        color: #FFF;
        text-shadow: 1px 1px #000;
        font-weight: bold;
        background-image: url(images/TR_Col-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    #CollapsiblePanel5 .CollapsiblePanelClosed .CollapsiblePanelTab  {
        background-color: #C3CFDF;
        border-radius: 5px 5px 0px 0px;
        color: #999
        text-shadow: 1px 1px #000;
        font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
        font-size: 18px;
        font-weight: bold;
        background-image: url(images/TR_Gray2-WEB.png);
        background-repeat: no-repeat;
        line-height: 52px;
    </style>

  • Is there a way to create a drop down menu with an automatic answer dependent on what is chosen?

    Is there a way to create a drop down menu with an automatic answer dependent on what is chosen? An if-then statement perhaps?  I am looking to add over 100 drop down options and would like to have a message automatically pop up depending one which option they chose.  Thank you.

    Hi,
    You would use the skip logic to conditionally show form items based on the selection within the drop-down menu. Here's a link to a description of the feature in our help documentation:
    http://help.adobe.com/en_US/formscentral/using/WSd789abd336388b1642c7fce012da94afe4f-8000. html#WS0faeceb8c23f5d60-774f03e3131ddc76d7d-8000
    Regards,
    Brian

  • My iPhone4 docks correctly with some devices but not others, please help!

    Hi,
    Firstly spologies if this is old news but sometimes its easier to 're-ask' than trawl thousands of pages!.....
    I have a 3-year old iPhone 4 that has developed a problem which i'm trying hard to solve;
    *Phone used to dock fine with anything and everything - this was about 1 year ago.
    *for no apparent reason it ceased docking with my Bose Soundock and a Logic3 accessory dock (connected to a hi-fi) at home
    *symptoms were; it would charge and operate as normal whilst docked but would not play music through either (the Logic3 dock did not acknowledge it was docked). Otherwise it would sync and connect normally with iTunes, etc. and connected fine when plugged into my car.
    *I reset it, restored it from back-up, updated/reinstalled iOS (this has since updated at least twice) with no other effects. Also checked and reset all settings.
    *I subsequently bought a Pure Contour dock as I was able to try it in the shop and my phone worked with it, plus it has Airplay anyway. I have since, in an attempt to find a bedside DAB radio/alarm dock that works with it, found that it works fine with some devices but not others with no rhyme or reason as to which.
    *2 days ago I changed out the docking port myself using a cheap replacement bought from Amazon, to see if it would cure.
    * now the problem is reversed! The Bose and Logic3 docks I have, that it wouldn't work on before, it now DOES....and the Pure dock and my car, which it DID work with before now fail to connect with it!
    *just to reiterate this, my wife's gen3 and gen5 iPods dock and work faultlessly with all devices mentioned....and mine had done previously.
    to my knowledge it is NOT;
    - a compatibility issue. The phone used to work fine on everything I had. Then it stopped. How's that?!
    - a connector issue. The male connectors on all docks haven't changed.......and the female connector in my phone has changed from liking selected devices to then liking the others!! (it is female after all ;-) !)
    -a software issue. iOS has been updated and the phone wiped and restored and all sorts so many times I can;t see how it can be!
    could it be a problem with the data exchange between phone and device when it is docked??
    or do I really need to try changing the port for an 'official' one??
    or is it just broken and that's that?!

    It's either a problem with the connector on your phone (dirt, lint, bent pin, corrosion) or with its connection to the motherboard inside. Cleaning the connector is a good place to start; either a dry toothbrush, air blast can or wood toothpick. Next inspect it carefully with a good magnifying glass or jeweler's loupe. If nothing turns up it is probably damage inside, which will be difficult to fix. Aren't you due for an upgrade about now? Your iPhone 4 is 3 generations out of date!

  • Everytime I open Safari on my MacBook Pro a pop-up window from my Finder menu, with the Applications highlighted on the left in the favorites column with the Resources folder highlighted comes up and locks my Safari page until I manually close the Resourc

    Everytime I open Safari on my MacBook Pro a pop-up window from my Finder menu, with the Applications highlighted on the left in the favorites column with the Resources folder highlighted comes up and locks my Safari page until I manually close the Resources window then I have to refresh the internet search address line at the top of Safari. Can someone tell me how to stop this. It started after a software upgrade. It didn’t do that before. Thank you.

    A few thoughts for diagnosis/testing purposes:
    Have you recently run the disk utility and repaired HD and permissions? If not do so.
    Boot into the Safe mode - hold down shift key on boot - and see if the problems are still there. Some functions won't work but see if anything odd happens.
    Check your startup items. Get rid of them temporarily.
    Create a new user account and see if the problems occur with the new account.
    Lastly, be sure your backup is up-to-date.

  • How do I alphabatize all my bookmarks from the drop down menu with the star on the Right side of screen?

    I want to alphabatize all my bookmarks that are in the drop down menu, the menu with the star icon, on the right side of the screen. I do not want to put them in folders or view them in the box from the menu bar and all the answers pertain to that box, and not to the one with the star. Thank you

    I don't think it's possible from the toolbar button.
    However, the action you take in the Bookmarks Sidebar or in the Library dialog will affect the Bookmarks Menu everywhere it is displayed, including the toolbar button, so you only need to use it for the few moments needed to use Sort By Name and then close it.
    Bookmarks Sidebar (either):
    * View menu > Sidebar > Bookmarks
    * Command+b
    Library dialog (either):
    * Bookmarks menu > Show All Bookmarks
    * Command+Shift+b
    right-click "Bookmarks Menu" > Sort By Name

  • How do I create a drop down menu with multiple items in Adobe Acrobat 9?

    I am trying to create a drop down menu with four items within a field box.  When I try to do this
    the font is too big and it just doesn't fit.

    You can use panel widget to create manual menu where set to show target on rollover.
    Something like this :
    http://muse.adobe.com/exchange-library/menu-vertical-accordion-widget-1
    http://muse.adobe.com/exchange-library/tiptop-navigation-menu
    Thanks,
    Sanjit

  • I'm having problems (1)selecting onscreen text, (2) having problems resizing menu boxes and selecting menues with the cursor. I'm not able to select menus and move them. I'm not sure how to correct this.

    I'm having problems (1) selecting onscreen text, (2) resizing menu boxes and selecting menues with the cursor. I'm not able to select menus and move them. I'm not sure how to correct this.

    1) This is because of software version 1.1. See this
    thread for some options as to how to go back to 1.0,
    which will correct the problem...
    http://discussions.apple.com/thread.jspa?threadID=3754
    59&tstart=0
    2) This tends to happen after videos. Give the iPod a
    minute or two to readjust. It should now be more
    accurate.
    3) This?
    iPod shows a folder icon with exclamation
    point
    4) Restore the iPod
    5) Try these...
    iPod Only Shows An Apple Logo and Will Not Start
    Up
    iPod Only Shows An Apple Logo
    I think 3,4, and 5 are related. Try the options I
    posted for each one.
    btabz
    I just noticed that one of the restore methods you posted was to put it into Disk Mode First rather than just use the resstore straight off, I Have tried that and seems to have solved the problem, If it has thank you. previously I have only tried just restoring it skipping this extra step. Hope my iPod stays healthy, if it doesnt its a warrenty job me thinks any way thanks again

Maybe you are looking for

  • ABUMN, default transaction types

    Hello, I have executed an asset transfer via transaction ABUMN. This is an asset transfer within the same asset class and same company code. This process generated a FI document with 4 line items and all the line items have an asset transaction type

  • Apllication server startup proiblem

    Dear guys, I am getting this error repeatedly, Frm -92101 server start up proble.. what could be the reason for this and how to solve it.. Regards, S.arulmani

  • Dimension Build Rule Null Processing

    Hi There, I try to build Dimension Rule file with Generation build, I have Gen2, Gen3, Gen4, Gen5, Gen6, but some only goes to Gen3, so I check Null Processing, hoping this will take care of the issue. However, I still got error "Child Member 368 wit

  • Link betwen tables

    Hi all, Am new to abap..Can anybody temme how to get exact link between table Ekko and  view Viaufks. Thankx in advance, Ramya.

  • Petition: We Get to Choose Which Program to Sync

    Instead of forcing us to sync with WMP0 we should be able to pick to use the Creative Explorer or it. I don't like the idea of being cut out of what the given software has to offer. There might be things we want to use the CE for and then we reconnec