Accordion jumps in IE
Hello,
Does anyone else have the problem in IE7 of the accordion
itself ever so slightly shrinking in size for a moment when opening
one of the panels? it's not a specific page but every spry
accordion I see in IE7 does it. Even the ones on the Adobe labs
accordion samples page do it. In FF the panels just open and close
without any movement of the accordion itself and it looks great.
But IE7, it kind of jiggles. The only time it doesn't shrink and
grow is if the animation is turned off.
Could it just be that I have the developer toolbar loaded and
that causes it? I'm surprised that I can't find other posts about
this.
Thanks for any help from the Adobe team or anyone else
noticing this. The page I was referring to on adobe labs is here:
http://labs.adobe.com/technologies/spry/samples/accordion/AccordionSample.html
and again, the only time it doesn't do it on that page is
where the animation is turned off.
I've experienced the same problem and the solution is given
in this topic:
http://www.adobe.com/cfusion/webforums/forum/messageview.cfm?forumid=72&catid=602&threadid =1304615&highlight_key=y&keyword1=%20%09Accodion%20panel%20bug%3F
regards,
morpheto
Similar Messages
-
Spry Accordion jumping to the top of the page
Hi
I've just about go the accordion looking perfect (it's a
great effect!), except that in IE7 when a panel lower down the list
is selected, the page jumps so that the highest panel is at the top
of the screen. As my accordion is longer than the screen this means
that the panel that is selected is off the bottom of the screen.
Does anyone have any suggestions for fixing this? It works
perfectly in Firefox.
Many thanks in advance!I saw you are using an old version of Spry accordion.. you
use Spry.1.4 and the latest version is Spry 1.6 which contains some
bugs fixed for accordion widget.
Update link:
http://labs.adobe.com/technologies/spry/home.html
Please update to the latest version and make the keyboard
navigation change and see if still happens the pb.
Diana -
Accordion jumps one pixel in Safari 3
When the accordion opens and closes in Safari 3 on the Mac
the height changes by one pixel, causing the accordion bottom to
jump and and down by a pixel.
I know this is not a big deal, but it sure is annoying. Seems
to be caused by the last timing loop used to slow down the opening
and closing.I decided to try removing Pithhelmet, which, I suppose, should have been the first thing I tried. I had tried disabling it from within Safari, and that didn't do anything, so I thought that that wasn't the problem. So, in desperation, I completely removed the Pithhelmet SIMBL plugin. The problem has gone away. I still get the weird MIME error, but it doesn't seem to affect the image zoom.
-
I'm having a lot of trouble with my accordion. It is a long list of panels, so you have to scroll to see the bottom. The problem is, any time you click a tab, it throws you back up to the top of the page. I want it to stay on the tab the person clicks. Can someone help me with this? Here is the code I have on my entire page.
<!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>Untitled Document</title>
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
<style type="text/css">
<!--
body {
background-image: url(Backgrounds/Meet_the_faculty_Bkgd.gif);
background-repeat: no-repeat;
background-color: #000;
-->
</style>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<link href="SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
<link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
</head>
<body>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<table width="1203" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="222" valign="top"><ul id="MenuBar1" class="MenuBarVertical">
<li><a href="FGBI-Web-Home-Page.html">Home</a></li>
<li><a href="Vision.html">Our Vision</a></li>
<li><a href="#" class="MenuBarItemSubmenu">What's New?</a>
<ul>
<li><a href="FGBI_News_Flash.html">Weekly News Flash</a></li>
<li><a href="Where_Will_We_Be.html">Where Will We Be?</a></li>
<li><a href="Upcoming_Events.html">Upcoming Events</a></li>
<li><a href="FGBI_Calendar.html">Academic Calendar</a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">About Us</a>
<ul>
<li><a href="Who_We_Are.html">Who We Are</a></li>
<li><a href="What_We_believe.html">What We Believe</a></li>
<li><a href="FGC_Export.html">FGC Export</a></li>
<li><a href="FGC_Missions.html">FGC Missions</a></li>
<li><a href="Contact.html">Contact Us</a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Prospective Student</a>
<ul>
<li><a href="#" class="MenuBarItemSubmenu">Academics</a>
<ul>
<li><a href="Grading_Scale.html">Grading Scale</a></li>
<li><a href="Class_Descriptions.html">Class Descriptions</a></li>
</ul>
</li>
<li><a href="Finances.html">Finances</a></li>
<li><a href="Campus.html">Campus</a></li>
<li><a href="Student_Life.html">Student Life</a></li>
<li><a href="Catalog_Request.html">Request Catalog</a></li>
</ul>
</li>
<li><a href="#" class="MenuBarItemSubmenu">Our Ministries</a>
<ul>
<li><a href="Weekend_Ministries.html">Weekend Ministries</a></li>
<li><a href="Choir.html">Choir</a></li>
<li><a href="SENT.html">S.E.N.T.</a></li>
<li><a href="Playcast.html">Playcast</a></li>
<li><a href="Publishing.html">Publishing</a></li>
<li><a href="Summer_Evangelism.html">Summer Evangelism</a></li>
</ul>
</li>
<li><a href="Alumni.html">Alumni</a></li>
<li><a href="Store Images/FGBI_Store.html">Store</a></li>
<li><a href="Media_Center.html">Media Center</a></li>
</ul></td>
<td width="943" align="left"><div id="Accordion1" class="Accordion" tabindex="0">
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Thomas_Peretic_Header.gif" alt="Thomas Peretic" width="750" height="50" /></div>
<div class="AccordionPanelContent"><img src="Meet the faculty buttons/Thomas_Peretic_Content.gif" alt="Thomas Peretic" width="750" height="360" /></div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Donna_Peretic_Header_Black.gif" width="750" height="50" /></div>
<div class="AccordionPanelContent"><img src="Meet the faculty buttons/Donna_Peretic_Content.gif" alt="Donna Peretic" width="750" height="360" /></div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Chester_Heath_Header.gif" alt="Chester Heath" width="750" height="50" /></div>
<div class="AccordionPanelContent"><img src="Meet the faculty buttons/Chester_Heath_Content.gif" alt="Chester heath" width="750" height="360" /></div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Jayme_Carter_Header_Black.gif" width="750" height="50" /></div>
<div class="AccordionPanelContent"><img src="Meet the faculty buttons/Jayme_Carter_Content.gif" alt="Jayme Carter" width="750" height="360" /></div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Kissie_Carter_Header.gif" alt="Kissie Carter" width="750" height="50" /></div>
<div class="AccordionPanelContent"><img src="Meet the faculty buttons/Kissie_carter_Content.gif" alt="Kissie Carter" width="750" height="360" /></div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Paul_McGechie_Header_Black.gif" width="750" height="50" /></div>
<div class="AccordionPanelContent"><img src="Meet the faculty buttons/Paul_McGechie_Content.gif" alt="paul McGechie" width="750" height="360" /></div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Becky_Nichols_Header.gif" alt="Becky Nichols" width="750" height="50" /></div>
<div class="AccordionPanelContent"><img src="Meet the faculty buttons/Becky_Nichols_Content.gif" alt="Becky Nichols" width="750" height="360" border="0" /></div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Mercy_Schultz_Header_Black.gif" width="750" height="50" /></div>
<div class="AccordionPanelContent">Content 8 kdjafdsklfj adkfjadskljf </div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/James_Burgess_Header.gif" alt="James Burgess" width="750" height="50" /></div>
<div class="AccordionPanelContent">Content 9 sdlfkaksd klfjrkljrkj rkjtkrljt </div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Aaron_Hough_Header_Black.gif" width="750" height="50" /></div>
<div class="AccordionPanelContent">Content 10d;fak okr;okaorktroorkmrgkmklmfgklfndgkj fkjg </div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Sarah_Burgess_Header.gif" alt="Sarah Burgess" width="750" height="50" /><img src="Meet the faculty buttons/images/Victoria_Hough_Header_Black.gif" width="750" height="50" /></div>
<div class="AccordionPanelContent">Content 11 fajdkfg jaerkljgklrjg kl</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Hannah_Randall_header.gif" alt="Hannah Randall" width="750" height="50" /><img src="Meet the faculty buttons/images/Virginia_McGechie_Header_Black.gif" width="750" height="50" /></div>
<div class="AccordionPanelContent">Content 12ds fadkfajdsfkljdfkjdkfl</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Brock_Moore_Header.gif" alt="Brock Moore" width="750" height="50" /></div>
<div class="AccordionPanelContent">Content 13/dadsfkalskf;lk dslfkdlkslkfkldklfk</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Wanda_Broadwater_Header_black.gif" width="750" height="50" /></div>
<div class="AccordionPanelContent">Content 14 fd kljdfgkljfdgkl jfgj fgj </div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Adjunct_Professors_Header.gif" width="750" height="50" /></div>
<div class="AccordionPanelContent">
<table width="768" border="6" cellspacing="0" cellpadding="0">
<tr>
<td width="221" align="center" valign="top"><img src="Adjunct Faculty/Estis_AF.JPG" width="165" height="109" /></td>
<td width="93" align="center" valign="top"><img src="Adjunct Faculty/Pahlman_AF.JPG" width="165" height="108" /></td>
<td width="220" align="center" valign="top"><img src="Adjunct Faculty/Messer_AF.JPG" width="164" height="108" /></td>
<td width="214" align="center" valign="top"><img src="Adjunct Faculty/Hayes_AF.JPG" width="163" height="118" /></td>
</tr>
<tr>
<td align="center" valign="top">Rev. Zane Estis, B.S.</td>
<td align="center" valign="top">Dr. Charles Pahlman, D.Min.</td>
<td align="center" valign="top">Rev. Dollas Messer</td>
<td align="center" valign="top">Mr. Roger Hayes, M.M. Ed., B. Mus.</td>
</tr>
<tr>
<td align="center" valign="top">Apologetics</td>
<td align="center" valign="top">Founder of SENT missions</td>
<td align="center" valign="top">Pauline Epistles</td>
<td align="center" valign="top"><p>Music Fundamentals</p></td>
</tr>
</table>
</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><img src="Meet the faculty buttons/images/Board_directors_header.gif" width="750" height="50" /></div>
<div class="AccordionPanelContent">C
<table width="749" border="6" cellspacing="0" cellpadding="0">
<tr>
<td width="267" align="center" valign="middle"> <img src="Board Members/Peretic_Board.JPG" width="149" height="223" align="middle" /></td>
<td width="225" align="center"><p> <img src="Board Members/Heath_Board.JPG" width="149" height="221" align="absmiddle" /></p></td>
<td width="239"><img src="Board Members/Hill_Board.jpg" width="157" height="227" /></td>
</tr>
<tr>
<td valign="top">Rev. Thomas Peretic, Chairman of the Board of Directors</td>
<td valign="top">Rev. Chester Heath, General Superintendant of Free Gospel Church, Inc. Secretary of the Board of Directors</td>
<td valign="top"><p>Dr. William F. Hill</p></td>
</tr>
<tr>
<td valign="top">Pastor of Free Gospel Church in Export, PA</td>
<td valign="top">Pastor of Free Gospel Church in N. Braddock, PA</td>
<td valign="top">Pastor of Calvary Evangelistic Center in Independance, IA</td>
</tr>
<tr>
<td><img src="Board Members/Lloyd_Board.jpg" width="149" height="207" /></td>
<td><img src="Board Members/Galiher_Board.jpg" width="143" height="212" /></td>
<td><img src="Board Members/Shuecraft_Board.JPG" width="134" height="200" /></td>
</tr>
<tr>
<td>Rev. J. Kevin Lloyd</td>
<td>Rev. C. Dwain Galiher</td>
<td>Rev. Lloyd Shuecraft</td>
</tr>
<tr>
<td>Pastor of First Pentecostal Church of Murlin Heights, in Dayton, OH</td>
<td>Pastor of Junction Hill Pentecostal Church, in Junction Hill, MO</td>
<td>Pastor of Fairland Holiness Church in Fouke, AR</td>
</tr>
<tr>
<td><img src="Board Members/Massey_Board.JPG" width="137" height="205" /></td>
<td><img src="Board Members/Chappell_Jr_Board.jpg" width="130" height="197" /></td>
<td><img src="Board Members/chappell_Sr_Board.jpg" width="144" height="185" /></td>
</tr>
<tr>
<td>Rev. J. Clayton Massey</td>
<td>Rev. Tim Chappell</td>
<td>Rev. John Chappell</td>
</tr>
<tr>
<td>Pastor of Free Gospel Church of McKees Rocks, PA</td>
<td>Free Gospel Church, Liginior, PA</td>
<td>Pastor of Free Gospel Church, Liginior, PA</td>
</tr>
</table>
</div>
</div>
</div>
</div></td>
<td width="38"> </td>
</tr>
</table>
<p> </p>
<p> </p>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
var Accordion1 = new Spry.Widget.Accordion("Accordion1");
//-->
</script>
</body>
</html>Hi,
Even if it is possible to have the Accordion stay where it is (and I have no doubt that it can be done), there are better ways of designing your layout without having to scroll down.
Reduce the height of the tab image. I tried at 20px high and the whole Accordion was visible
Classify the Accordion topics and spread them over several pages
Create a master/detail area in lieu of an Accordion
Create a Tabbed Panels area with the tabs on the left side in lieu of an Accordion
These are just some suggestions which will hopefully help.
Ben -
How do I make my accordion spry not "jump" or "hiccup" in IE??
Ok, sorry you guys, I'm a newbie.
It seems that no matter what I do, I can't get the accordion to co-operate with Internet Explorer. It has always jumped when tabs are clicked and then settles down. It's rather irritating and I would like to fix it. I've run out of things to try. Can anyone help?
In addition, with attempts to make keep the accordion and background centered I used a div with the position centered, which worked, but only in FF and Chrome. In IE it stays far left. When I had it in a table, I could set a left: px in the class, but never figured out how to center it with a table so it would change position based on the monitor resolution. If there's a better way to do this that IE and other browsers like, please help me. If it's just IE that has the problem is there any way to make it like my code?
If you can help me change the height of the accordion, that would be great. It seems it doesn't want to stretch out, but maybe I'm writing it in the wrong section or the wrong way.
Another minor issue is the IE not doing the transparency I set on the tabs. I heard that they took that feature out. Is that true or is there a way to set it for IE?
Here's what I have so far:
+<!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>Bonnie Praymayer</title>
<link rel="stylesheet" type="text/css" href="css/main.css" />
<script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
<link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
p.MsoNormal {
margin-top:0cm;
margin-right:0cm;
margin-bottom:10.0pt;
margin-left:0cm;
line-height:115%;
font-size:11.0pt;
font-family:"Calibri","sans-serif";
-->
</style>
</head>
<body>
<table id="big">
<tr>
<td><table width="200" border="1" id="table" name="table">
<tr>
<td><div id="Accordion1" class="Accordion" tabindex="0">
<div class="AccordionPanel">
<div class="AccordionPanelTab">
<span class="tabContent">Benefiting People Like You
</span>
</div>
<div class="AccordionPanelContent">
<div class="panelContent">
<p >I specialize in deep tissue massage. As you may know already, massage therapy is the manipulation of soft tissue with the goal to improve well-being and heal injuries. It can involve just about any part of the body, but generally most people have stiffness and injuries in the back and neck. I enjoy using this type of health maintenance to assist people like you. Massage therapy can be used to improve many ailments such as:</p>
<p >Muscle Strains, Sprains, Headaches, Migraines, Fibromyalgia, Edema, and High Blood Pressure</p>
<p >Beyond "ailments" massage is excellent for treating sore muscles in pregnant women as well as reducing stress in everyone.</p>
<p > </p>
</div>
</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab">
<span class="tabContent"> Reflexology - An Added Benefit
</span>
</div>
<div class="AccordionPanelContent">
<div class="panelContent"><p >In addition to massage therapy, I am certified to practice Reflexology of the feet. This is a therapy wherein pressure is applied to the feet to encourage the body to heal itself. It's as if the feet are a map to the body with the spine being the edge of what is known as the arch. There are key points such as the heart and lungs, sinuses, kidneys, and intestinal tract. </p>
<p> </p>Reflexology has been known to also be an indicator to hidden health issues. Many reflexologists can attest to the fact that upon finding sore areas in the feet, the corresponding organ(s) have later been discovered by a physician to be injured or diseased. It is not a replacement for healthcare, but for some, reflexology has proven to be an asset to gain knowledge of the workings of their body.<p></p>
<p >One thing to note: if you do receive a reflexology treatment it is normal to feel a little dizzy, fatigued, or flu-like if you don't hydrate yourself before and after.</p>
</div>
</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab">
<span class="tabContent"> How to Choose a Therapist
</span>
</div>
<div class="AccordionPanelContent">
<div class="panelContent"><p >To be honest, everyone has preferences for what he or she like in a massage, so there is no hard and fast rule. What I recommend is that you decide what you need treated whether it be muscle strain, stiff muscles, stress, poor circulation etc. You can decide what kind of massage you need based on what you decide you want massage to do for you.</p>
<p >If you need to de-stress, relax and do not have many sore stiff muscles then simple relaxation massage would be good for you. If you have a constant sore shoulder or neck then you really need a therapist that is capable of effectively loosening those fibres.</p>
<p >You may be able to determine if a therapist is right for you by talking with someone who has had a massage from that person. Otherwise, you can sometimes judge by the type of facility in which they are practicing. Typically a spa is going to give you strictly relaxation, although many therapists are capable of more if you request it. A chiropractor's clinic will often focus on rehabilitation of injured patients; more often than not they have massage therapists that are more than capable of working deep enough to affect injured tissue.></p>
<p > Communication is the key when it comes to during the treatment in order to customize and optimize your massage experience. Don't be afraid to speak up if you need to adjust the technique or pressure. After all, the massage is all about you!</p></div><p></p>
</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab"><span class="tabContent">My Practice</span></div>
<div class="AccordionPanelContent">
<div class="panelContent">
<p>My interest in massage therapy began at a very early age. Although I didn't know it was an actual profession, I started massaging at the age of 8 as I did my best to alievinate my mother's chronic pain from fibromyalgia. I, through time gained a natrual feel for detecting prolblem areas in the muscle and I learned what pressure is appropriate. </p>
<p>I took my training in 2006 at the Alberta Insitute of Massage for six months to earn a certificate for a 1100 hour program. Though short, it was intensive in the anatomy and physiology portion and very hands-on in the massage classes. It was my privilege to learn from three instructors who had more than 10 years experience as massage therapists and many years teaching it.</p>
<p>Since my training, I have had the opporutinty to work as a massage therapist for 3 years. I have treated people from all walks of life for countless ailments and injuries. It is my pleasure to do my utmost to see to it that each paitent recieves the treament they deserve and expect.</p>
</div>
</div>
</div>
</div></td>
</tr>
</table></td>
</tr>
</table>
<script type="text/javascript">
<!--
var Accordion1 = new Spry.Widget.Accordion("Accordion1");
//-->
</script>
</body>
</html>
@charset "utf-8";
/* CSS Document */
body {
background-image:url(../Images/WaterLeaf_Exp.png);
background-repeat: no-repeat;
background-position:center;
background-attachment:scroll;
background-color:#222222;
.panelContent {
color: #dcd2d2;
font-size: 14px;
font-family: Verdana, Geneva, sans-serif;
margin-left: 15px;
margin-top: 20px;
.tabContent {
color: #333;
font-family: Verdana, Geneva, sans-serif;
font-size: 16px;
font-weight: 500;
color: #000;
padding: 15px;
#big {
/*background-image*/
background-repeat:no-repeat;
border: none;
top: 0px;
margin-left: 23.5%;
position: static;
height: 800px;
width: 955px;
#table {
width: 700px;
height: 290px;
/*margin-top: 1%;
margin-left: 125px;*/
border: none;
position: relative;
z-index: 2;
@charset "UTF-8";
/* SpryAccordion.css - version 0.4 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
/* This is the selector for the main Accordion container. For our default style,
* we draw borders on the left, right, and bottom. The top border of the Accordion
* will be rendered by the first AccordionPanelTab which never moves.
* If you want to constrain the width of the Accordion widget, set a width on
* the Accordion container. By default, our accordion expands horizontally to fill
* up available space.
* The name of the class ("Accordion") used in this selector is not necessary
* to make the widget function. You can use any class name you want to style the
* Accordion container.
.Accordion {
border-left: solid 1px gray;
border-right: solid 1px black;
border-bottom: solid 1px gray;
overflow: hidden;
/* This is the selector for the AccordionPanel container which houses the
* panel tab and a panel content area. It doesn't render visually, but we
* make sure that it has zero margin and padding.
* The name of the class ("AccordionPanel") used in this selector is not necessary
* to make the widget function. You can use any class name you want to style an
* accordion panel container.
.AccordionPanel {
margin: 0px;
padding: 0px;
/* This is the selector for the AccordionPanelTab. This container houses
* the title for the panel. This is also the container that the user clicks
* on to open a specific panel.
* The name of the class ("AccordionPanelTab") used in this selector is not necessary
* to make the widget function. You can use any class name you want to style an
* accordion panel tab container.
* NOTE:
* This rule uses -moz-user-select and -khtml-user-select properties to prevent the
* user from selecting the text in the AccordionPanelTab. These are proprietary browser
* properties that only work in Mozilla based browsers (like FireFox) and KHTML based
* browsers (like Safari), so they will not pass W3C validation. If you want your documents to
* validate, and don't care if the user can select the text within an AccordionPanelTab,
* you can safely remove those properties without affecting the functionality of the widget.
.AccordionPanelTab {
background-color: #FFF;
/*border-top: solid 1px black;*/
border-bottom: solid 1px gray;
margin: 0px;
padding: 2px;
cursor: pointer;
-moz-user-select: none;
-khtml-user-select: none;
filter:alpha(opacity= 30);
opacity: 0.3;
-moz-opacity:0.3;
/* This is the selector for a Panel's Content area. It's important to note that
* you should never put any padding on the panel's content area if you plan to
* use the Accordions panel animations. Placing a non-zero padding on the content
* area can cause the accordion to abruptly grow in height while the panels animate.
* Anyone who styles an Accordion *MUST* specify a height on the Accordion Panel
* Content container.
* The name of the class ("AccordionPanelContent") used in this selector is not necessary
* to make the widget function. You can use any class name you want to style an
* accordion panel content container.
.AccordionPanelContent {
overflow: auto;
margin: 0px;
padding: 0px;
height: 200px;
/* This is an example of how to change the appearance of the panel tab that is
* currently open. The class "AccordionPanelOpen" is programatically added and removed
* from panels as the user clicks on the tabs within the Accordion.
.AccordionPanelOpen .AccordionPanelTab {
/*background-color: #cccccc;*/
/* This is an example of how to change the appearance of the panel tab as the
* mouse hovers over it. The class "AccordionPanelTabHover" is programatically added
* and removed from panel tab containers as the mouse enters and exits the tab container.
.AccordionPanelTabHover {
color: #93C;
filter:alpha(opacity= 50);
opacity: 0.5;
-moz-opacity:0.5;
.AccordionPanelOpen .AccordionPanelTabHover {
color: #cccccc;
filter:alpha(opacity= 30);
opacity: 0.3;
-moz-opacity:0.3;
/* This is an example of how to change the appearance of all the panel tabs when the
* Accordion has focus. The "AccordionFocused" class is programatically added and removed
* whenever the Accordion gains or loses keyboard focus.
.AccordionFocused .AccordionPanelTab:hover {
background-color: #FFF;
filter:alpha(opacity= 20);
opacity: 0.2;
-moz-opacity:0.2;
.AccorrdionPanelOpen:hover {
filter:alpha(opacity= 90);
opacity: 0.9;
-moz-opacity:0.9;
color:#F00
.AccordionPanelOpen .AccordionPanelTab {
background-color: #390;
filter:alpha(opacity= 30);
opacity: 0.3;
-moz-opacity:0.3;You would make this a little easier if you posted a link to the page.
Most of the jump seems to be some extra padding or margin between the tabs when you rollover, but I am not able to find it. Is there any other css that is governing this page? I did remove a couple of <p></p> set of tags you had and it improved the jump, but it is still there.
If the page is live, run it through the validator http://validator.w3.org/ , fix whatever errors it finds, if you still have the jump, post a link to the page and the issue might get found.
Gary -
How can I make the spry accordion remember the panel open
when I refresh the page or jump to a new page?
I am using the accordion feature on all my pages as a
navigation aid. It has three panels. When you refresh the page the
panel goes back to the default pane... Is there a way of
controlling this so that the browser can remember the pane that is
open (say set a variable, cookie, other?)Look for "Set the default open panel" on the following page:
http://labs.adobe.com/technologies/spry/articles/accordion_overview/index.html
Keep in mind you would need to change that bit of code on
every page. The only way to do it more dynamically would be to
include a custom javascript or PHP/ASP style script in order to
change the value. -
Spry Accordion Jerky/Jumping movement Issues in IE
I am having a difficult time trying to debug the accordion in IE. You can see the accordion here in IE I am having two issues.
1. When at the top of the site and clicking on a tab to open it jumps down the page as if it were an anchor point, and I find this very annoying.
2. The movement below the tab clicked is jumping around and this also is incredibly annoying to me, its more subtle than the above issue but it still bothers me. I am having this issue in GC as well.
I have searched quite a few forums and have not found a solution for this but this must be a fairly common issue? I am not that familaur with spry yet this is my first real project using it so my knowledge is very limited to this point. This dose work perfect in FF.
Thanks in advance,I will put together a gutted version of this and send it over if you have the time that would be fantastic. Making a gutted version may be the best thing at this point so I can slowly add stuff back and see what causes the problem. If i cant fix it by doing that I will zip and send the files.
Date: Tue, 27 Oct 2009 15:23:40 -0600
From: [email protected]
To: [email protected]
Subject: Spry Accordion Jerky/Jumping movement Issues in IE
Can you provide me with files where I can reproduce your issue with
out any other scripts on the site? This gives me a better debugging
area. If you do not feel comfy with posting it online. You can e-mail
it to mailto:[email protected]
> -
Using accordion widget as a menu in header causes footer to jump up page... (containing BC blog)
Hi all,
So I'm using an accordion panel widget as a collapsible menu in the header and I have the ol' "{tag_pagecontent} BC blog thing going on (displaying a BC blog in an HTML box on a page),
except when I publish this to BC, the footer jumps up the page and sits behind the blog content (yes, the footer checkbox is selected, no I don't have sticky footers enabled). When I remove the accordion panel and replace it with a simple "home" button (actually a hyperlinked image), the footer acts as intended.
So the issue here seems to be with the accordion panel causing a problem, but what's going on and how do I stop it so I can display the accordion menu on my blog template page?
Anyone have any ideas? Is it simple to fix and am I just overlooking something blatantly obvious because I'm tired?
Any help on this would be greatly appreciated!
Thanks.Hi, Sorry for the late response, are you still experiencing this issue. If yes, please let me know
-
Accordion Spry shows a strange blue glow when clicked on... And the tabs jump a bit...
I am having a problem on the page below.
I was able to make the TEXT stop glowing blue when in focus, but can't manage to get this blue-glow outer line wrapped around the spry object. I have no idea how to fix it.
Here's the page where the issue happens- http://www.fci.tv/home/casestudies.html
Here's a link to the page's CSS file- http://www.fci.tv/home/css/style.css
And a link to the Accordion CSS- I've modified it a little to get rid of the ugly default setup, but still see this blue glow around the spry.... http://www.fci.tv/home/spryassets/spryaccordion.css
Lastly, when you click on any of the three spry-menu options, the panels slide with a strange jump. Can you please provide any insight to this problem?
Thank you!
HugoHello there.
Thank you very much for your input. This worked perfectly.
Thank you!
Hugo -
Accordion makes page jump with SpryURLUtils
Hi,
To see my problem you need to reduce the depth of the browser
window or click "Quick Contact" to expand the page. Then refresh or
click samples 02.
http://www.adelantedesign.co.uk/websites/adelante/Packaging/Packaging_Samples01.asp?panel= 1#Accordion1
The problem is, it's like there is an anchor to the top of my
Accordion Panel when the page loads it pulls the Accordion Panel to
the top.
Is there something I can change to disable this?
Thanks for looking,
RichHey there Rich i believe the issue is still happening in IE 7
for your problem which is just like mine. I am hoping to figure out
a way to stot the autoFocus from moving the page focus to the top
of the Accordion Object.
Anyone have any ideas on how to edit the JS to have this work
properly?
Thanks! -
Spry Accordion Widget Jumps in Safari and Firefox
I'm an intermediate designer in Dreamweaver, and am developing a site with spry accordions in it, to have a lot of info in one spot.
My problem is when clicking on the next tab, the whole wiget jumps down quite a bit then slows down when the panel opens at the top.
I have no idea how to fix this, have searched forums and the code within the website.
I'm Stuck, Help me!
http://file:///Volumes/eb631806/c4%20executive%20security%20services/Site/training.html
http://file:///Volumes/eb631806/c4%20executive%20security%20services/Site/services.htmlThe links don't work, sorry
I'll figure out how to get a link that works, on here -
DW CS4 Help with jump menu opening a new window.
First, I can't believe that Adobe left out an easy to use behavior to do this.
I have some jump menus, and I would like the selection to open up a new window and have the content appear there. I saw a couple of old topics here that offered some suggestions, but they didn't work for me. I could get it to open a new window, but the content was not there. I saw where you need to add a "GO" button, and add a "Open New Window"behavior to it. That is what opened the new window with new content. I do not have the "GO" buttons on the jump menus in this code, but did try it and it didn't work. If anyone can help and tell me how to do it, and where to place the code, I would greatly appreciate it.
I know this is long, but here is my code for the page.
<!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"><!-- InstanceBegin template="/Templates/Master_Template.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>Mickey Adams Index</title>
<!-- InstanceEndEditable -->
<link href="../twoColFixLtHdr.css" rel="stylesheet" type="text/css" />
<!--[if IE 5]>
<style type="text/css">
/* place css box model fixes for IE 5* in this conditional comment */
.twoColFixLtHdr #sidebar1 { width: 230px; }
</style>
<![endif]-->
<!--[if IE]>
<style type="text/css">
/* place css fixes for all versions of IE in this conditional comment */
.twoColFixLtHdr #sidebar1 { padding-top: 30px; }
.twoColFixLtHdr #mainContent { zoom: 1; }
/* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */
</style>
<![endif]-->
<!-- InstanceBeginEditable name="head" -->
<script src="../SpryAssets/SpryTabbedPanels.js" type="text/javascript"></script>
<script src="../SpryAssets/SpryAccordion.js" type="text/javascript"></script>
<link href="../SpryAssets/SpryTabbedPanels.css" rel="stylesheet" type="text/css" />
<link href="../SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
<!-- InstanceEndEditable -->
<script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="../SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
<link href="../CSS/global.css" rel="stylesheet" type="text/css" />
<!-- InstanceParam name="SecondTitle" type="boolean" value="true" -->
<!-- InstanceParam name="SecondContent" type="boolean" value="true" -->
<!-- InstanceParam name="OptionalRegionTitle_2" type="boolean" value="true" -->
<!-- InstanceParam name="OptionalRegion_2" type="boolean" value="true" -->
<!-- InstanceParam name="OptionalRegion1" type="boolean" value="true" -->
</head>
<body text="#000033" class="twoColFixLtHdr" title="What's New">
<div id="container">
<div id="header">
<h1>Richard Sinkler</h1>
<!-- end #header --></div>
<div id="sidebar1">
<ul id="MenuBar1" class="MenuBarVertical">
<li><a href="../index.html">Home</a> </li>
<li><a href="../About_Me.html">About me</a></li>
<li><a href="../Calendars/Calendar_menu.html">Calendars</a></li>
<li><a href="../What's New.html">What's New</a></li>
<li><a href="../Equipment.html">Equipment</a></li>
<li><a href="../Tunings.html">Tunings</a></li>
<li><a href="../Video_and_Sound/video_menu.html">Sound & Video</a></li>
<li><a href="../web_gallery.html">Photos</a></li>
<li><a href="Mickey_Adams_Menus.html">Mickey Adams</a></li>
<li><a href="../Website_Info.html">Website Info</a></li>
<li><a href="../Contact Me.html">Contact Me</a></li>
</ul>
<p class="justHostReferral">If you would like to get your own website, please click the <span class="justHostItalics">JUST HOST</span> logo below and it will take you the sign up page. I am a <span class="justHostItalics">JUST HOST</span> affiliate and get credit for referring you to their service.</p>
<p><a href="http://stats.justhost.com/track?ca5fb2154d5aabc236853ccef2513f2ec"><img src="http://affiliates.justhost.com/control/img/banners/justhost_125x125v2.gif" /></a> </p>
<h3 class="updated">Updated 7/18/2011
<!-- end #sidebar1 -->
</h3>
<p> </p>
</div>
<div id="mainContent">
<h1><!-- InstanceBeginEditable name="PageTitle" -->Mickey Adams Video Index<!-- InstanceEndEditable --></h1>
<!-- InstanceBeginEditable name="PageContent" -->
<p class="pageContent">Click a tab to open the category. <a href="Mickey_Adams_Menus.html" class="playbackCtrlMSg">Click to go back to Menu Page</a></p>
<div id="m_a_video_index" class="TabbedPanels">
<ul class="TabbedPanelsTabGroup">
<li class="TabbedPanelsTab" tabindex="0">BE</li>
<li class="TabbedPanelsTab" tabindex="0">BEX</li>
<li class="TabbedPanelsTab" tabindex="0">BEC</li>
<li class="TabbedPanelsTab" tabindex="0">Beginner</li>
<li class="TabbedPanelsTab" tabindex="0">Faux C6</li>
<li class="TabbedPanelsTab" tabindex="0">Uncategorized</li>
</ul>
<div class="TabbedPanelsContentGroup">
<div class="TabbedPanelsContent">
<p><strong><u>BE01</u></strong><u>:Beginners: 3 Moves to Master</u> <br />
<strong><u>BE04</u></strong><u>: Simple E9 Passage, Single Note</u> <br />
<strong><u>BE06</u></strong><u>: 4-5-1 In G, Using ABC Pedals</u> <br />
<strong><u>BE07</u></strong><u>: 1-2-5 Single Note+ 3 <strong>Stops</strong></u><br />
<u>BE 109a Close Intervals in C</u><br />
<strong><u>BE11</u></strong><u>: Beginner Steel Guitar, Cold Cold Heart</u> <br />
<strong><u>BE12</u></strong><u>: Cold Cold Heart Part II</u> <br />
<strong><u>BE16</u></strong><u>: Waltz Across Texas</u> <br />
<strong><u>BE24A</u></strong><u> Big City Turnaround</u> <br />
<strong><u>BE28</u></strong><u>: Your Man, Josh Turner</u> <br />
<strong><u>BE31</u></strong><u>: Minor Chords-Moondance</u> <br />
<strong><u>BE34</u></strong><u>: 3 Moves to Master, Part II</u> <br />
<strong><u>BE36</u></strong><u> Harmonics, Overtones</u> <br />
<strong><u>BE40</u></strong><u> 2M-5-1 Faux C6 Moves for Cherokee Maiden</u></p>
<p><strong><u>BE41</u></strong><u> Second String Usage</u></p>
</div>
<div class="TabbedPanelsContent">
<p><strong><u>BEX1</u></strong><u>: A+B Repetitious Excercise, Major Key</u> <br />
<strong><u>BEX2</u></strong><u> Pick Blocking Dexterity Excercise II</u> <br />
<strong><u>BEX6A</u></strong><u>-Pick Blocking Exercise B+C, F</u> <br />
<strong><u>BEX7</u></strong><u> Speedpicking Lesson 1 Revision 1</u> <br />
<strong><u>BEX12</u></strong><u>: G Major, Lesson 2-Pedal Changes, Chord Forms</u> <br />
<strong><u>BEX14</u></strong><u>: D7, G Lever Programming, Speed</u> <br />
<strong><u>BEX16</u></strong><u>: G Major-Lesson 1</u> <br />
<strong><u>BEX16a</u></strong><u> G major Descending Exercise</u> <br />
<strong><u>BEX17</u></strong><u>: Pick-Blocking 101, Beginner Steel Guitar</u> <br />
<strong><u>BEX21</u></strong><u> Faux C6, 1-4-5-1</u> <br />
<strong><u>BEX21</u></strong><u>-2-5-1 Chord Change</u> <br />
<strong><u>BEX21</u></strong><u> Alternating Fingering Excercise</u> <br />
<strong><u>BEX21</u></strong><u> Glissando Excercise 1</u> <br />
<strong><u>BEX25</u></strong><u> Faux C6 1-5-1 in D</u> <br />
<strong><u>BEX27</u></strong><u> C Pentatonic Scale Ex1</u> <br />
<strong><u>BEX27a</u></strong><u> C Pentatonic Ex2</u> <br />
<strong><u>BEX27b </u></strong><u>A Blues Pattern</u> <br />
<strong><u>BEX28</u></strong><u> Pedal & Lever Excercises for Beginners</u> <br />
<strong><u>BEX 92</u></strong><u> D7 Exercise</u> <br />
<strong><u>BEX 93</u></strong><u> 2 String Exercise, Lever I, Pedal H</u></p>
</div>
<div class="TabbedPanelsContent">BEC
<div id="Accordion1" class="Accordion" tabindex="0">
<div class="AccordionPanel">
<div class="AccordionPanelTab">BEC pg. 1</div>
<div class="AccordionPanelContent">
<p><u>BEC4: Blue Eyes Elton John</u> <br />
<u>BEC6 Broken Wing</u> <br />
<u>BEC15: Goin Through the Big "D"</u> <br />
<u>BEC25: I Sang Dixie, Take II</u> <br />
<u>BEC31: Beginner Steel-Longer, Fogelberg</u> <br />
<u>BEC32: Longer, Flute Solo, Fogelberg</u> <br />
<u>BEC35: Nobody In His Right Mind</u> <br />
<u>BEC41: Too Cold At Home Intro, Mark Chestnutt</u> <br />
<u>BEC45: Teach Your Children: Intro</u> <br />
<u>BEC48: Take Your Memory With You</u> <br />
<u>BEC52 Thinking Thing Intro</u> <br />
<u>BEC54: What A Wonderful World</u> <br />
<u>BEC66: Solo, Look At Us</u> <br />
<u>BEC69: Somewhere Over The Rainbow, Bridge</u> <br />
<u>BEC73: Empty Glass Intro</u> <br />
<u>BEC77: Set-em Up Joe Vern Gosdin</u> <br />
<u>BEC78- So Much It Hurts Me Part 1</u> <br />
<u>BEC78a So Much It Hurts Me Part 2</u> <br />
<u>BEC81, Who Needs You Baby, Clay Walker</u> <br />
<u>BEC82 City Lights</u></p>
</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab">BEC pg. 2</div>
<div class="AccordionPanelContent">
<p><u>BEC83 Save The Honky Tonks, Mark Chestnutt</u> <br />
<u>BEC84 Faux C6, Deep Water Intro, Beginners</u> <br />
<u>BEC85 There's your Trouble Intro</u> <br />
<u>BEC86 Panama Red Intro, Remake</u> <br />
<u>BEC88 Diamond Rio One More Day Intro</u> <br />
<u>BEC89 Turnaround In C</u> <br />
<u>BEC89 Oh Little Town of Bethlehem</u> <br />
<u>BEC90 I Had A Beautiful Time, Solo</u> <br />
<u>BEC91 White Christmas</u> <br />
<u>BEC91a White Christmas</u> <br />
<u>BEC91c White Xmas, Improvising</u> <br />
<u>BEC92 Farewell Party Intro Simplified</u> <br />
BEC 92a Farewell Party Solo, Mike Johnson<br />
<u>BEC93-This Ain’t My First Rodeo-Intro</u> <br />
<u>BEC-94 Third Rate Romance Solo</u> <br />
<u>BEC-95 Crazy Arms Intro, Patty Loveless</u> <br />
<u>BEC-96 Bar Room Roses Intro Troy Cassar Daley</u> <br />
<u>BEC-97 Close Up the Honky Tonks-Intro</u> <br />
<u>BEC98-Turnaround 5-1, BC,+E-lever</u> <br />
<u>BEC-99 Single Note Run in D</u></p>
</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab">BEC pg. 3</div>
<div class="AccordionPanelContent">
<p><u>BEC 100 Different Light Doug Stone Intro E9</u> <br />
<u>BEC 100 When Love Comes Around Intro Alan</u> <br />
<u>BEC 100 Take It Easy</u> <br />
<u>BEC101 Fourteen Minutes Old Intro Doug Stone</u> <br />
<u>BEC101 Bars Of Steel Bridge</u> <br />
BEC 101 Beneath Still Waters<br />
<u>BEC 102 Could I Have This Dance Intro</u> <br />
<u>BEC 103 Bars of Steel, Bridge</u> <br />
<u>BEC 106 Legend In My Time</u> <br />
<u>BEC107 When Did You Stop Loving Me Intro</u> <br />
<u>BEC 109 Getting Over You Again Intro Gene Watson</u> <br />
<u>BEC 110 Baby Thats Cold Intro</u> <br />
<u>BEC 111 Panama Red Solo Part 1</u> <br />
<u>BEC 111a Panama Red Solo, Part II</u> <br />
<u>BEC 111 Where Have I Been All My Life Intro</u> <br />
<u>BEC-112 Help Me Make it Through the Night.mpg</u> <br />
<u>BEC-118 Faux C6-1-6-2-5.mpg</u> <br />
<u>BEC-113 Way To Survive, Lesson 1.mpg</u> <br />
<u>BEC113a Way to Survive Lesson 2.mpg</u></p>
</div>
</div>
</div>
</div>
<div class="TabbedPanelsContent">
<p><u>Beginner Steel Guitar, Cmajor in 3rds</u> <br />
<u>Beginner Pedal Steel, Cross Picking, B Pedal</u> <br />
<u>Beginner Steel Guitar: San Antonio Rose</u> <br />
<u>Beginner Steel Guitar: Wonderful Tonight</u> <br />
<u>Beginner Steel Guitar: Oceanfront Property</u> <br />
<u>Beginner Steel-When you Say Nothing At All</u> <br />
<u>Memphis Tennessee, Beginner Steel Guitar</u> <br />
<u>Beginner Steel Guitar, Major Scale Excercise</u> <br />
<u>Beginner Steel, Amazing Grace</u></p>
</div>
<div class="TabbedPanelsContent">
<p><u>Walking After Midnight Faux C6</u> <br />
<u>All My Ex's Intro Faux C6 for the E9 Neck</u> <br />
<u>Faux C6 Turnaround in A</u> <br />
<u>5 1 Faux C6, Single note Passage</u></p>
</div>
<div class="TabbedPanelsContent">
<div id="Accordion2" class="Accordion" tabindex="0">
<div class="AccordionPanel">
<div class="AccordionPanelTab">Uncategorized pg. 1</div>
<div class="AccordionPanelContent">
<p><u>Simple Intro in C</u> <br />
<u>Panama Red Intro E9 Pedal Steel Guitar</u> <br />
<u>Danny Boy, E9</u> <br />
<u>Highway 40 Blues Intro, E9</u> <br />
<u>Diatonic Scale Movement In G</u> <br />
<u>1-7-4 1-2-4-5-1 Pedal Steel Guitar Intro</u> <br />
<u>1-4 Counterpoint Move in F, Very Effective</u> <br />
<u>Gene Watson Intro-Got No Reason Now for Going</u> <br />
<u>BIG CITY! Merle Haggard, Simple, Straightforward</u> <br />
<u>Someday Soon!..Simple, Great Solo!</u> <br />
<u>Texas Tornado, Tracy Lawrence, Intro and Solo</u> <br />
<u>Pick Dragging: Technique, Short Clip</u> <br />
<u>Key-A Turnaround, Blues/Diminished Walk</u> <br />
<u>Hello Trouble-JayDee Maness/ Desert Rose-</u> <br />
<u>Memories To Burn, Solo, Gene Watson</u> <br />
<u>When I Call Your Name</u> <br />
<u>Cross My Heart Solo, George Strait</u> <br />
<u>But For the Grace of God, Keith Urban</u> <br />
<u>I Never Go Around Mirrors, Gene</u> <br />
<u>Cryin My Heart Out, Ricky Skaggs</u> <br />
<u>Lonesome LA Cowboy Solo, Buddy Cage</u></p>
</div>
</div>
<div class="AccordionPanel">
<div class="AccordionPanelTab">Uncategorized pg. 2</div>
<div class="AccordionPanelContent">
<p><u>Teach Your Children:Quick Solo</u> <br />
<u>1982 Intro:Randy Travis</u> <br />
<u>Check Yes or No</u> <br />
<u>Fire On The Mountain, Marshall Tucker</u> <br />
<u>Buds Bounce, Simplified, Part 1</u> <br />
<u>Tonight The Heartache's On Me, Solo, Dixie Chicks</u> <br />
<u>Heartbroke, Steel Chords</u> <br />
<u>Funny How Time Slips Away</u> <br />
<u>Bars of Steel</u> <br />
<u>Blue, Leann Rimes</u> <br />
<u>Supernaw-Wishing Her well, Intro</u> <br />
<u>Look At Us, Johny Hughey, Intro</u> <br />
<u>Over The Rainbow Verse</u> <br />
<u>Discussion, Right Hand</u> <br />
<u>Verse, Help Me Make It Through The Night</u> <br />
<u>Rolling Pick Technique 2-5-1</u> <br />
<u>3 Octave Descending D7 Single Note Run</u> <br />
<u>Descending 5-1 Turnaround in A</u> <br />
<u>Pick Blocking Dexterity Excercise 1</u> <br />
<u>Alone In SanAntone</u></p>
</div>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
<!--
var TabbedPanels1 = new Spry.Widget.TabbedPanels("m_a_video_index", {defaultTab:2});
var Accordion1 = new Spry.Widget.Accordion("Accordion1");
var Accordion2 = new Spry.Widget.Accordion("Accordion2");
//-->
</script>
<!-- InstanceEndEditable -->
<h2>
<!-- end #mainContent -->
</h2>
</div>
<!-- This clearing element should immediately follow the #mainContent div in order to force the #container div to contain all child floats --><br class="clearfloat" />
<div id="clear"></div>
<div id="footer">
<p><a href="../index.html" class="footer_links">Home</a> <a href="../About_Me.html" class="footer_links">About Me</a><a href="../Calendars/Calendar_menu.html" class="footer_links">Calendars</a> <a href="../Equipment.html" class="footer_links">Equipment</a> <a href="../Tunings.html" class="footer_links"> Tunings</a> <a href="../Video_and_Sound/video_index.html" class="footer_links">Sound & Video</a><a href="../web_gallery.html" class="footer_links">Photos</a><a href="Mickey_Adams.html" class="footer_links">Mickey Adams </a><a href="../Website_Info.html" class="footer_links">Website Info</a><a href="../Contact Me.html" class="footer_links">Contact Me</a></p>
<p class="copyright"><span class="copyright"><span class="circleC"><span class="copyright"><span class="circleC">©</span></span></span><span class="copyright"> Copyright 2011 - Richard Sinkler - All Rights Reserved</span></span></p>
<p class="copyright"><span class="copyright"><span class="copyright">Website designed by Richard Sinkler</span></span></p>
<!-- end #footer --></div>
<!-- end #container --></div>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
//-->
</script>
</body>
<!-- InstanceEnd --></html>I'm confused by your post and code. Adobe has a function to do this. In the Insert Toolbar under the Tab "Forms" there is an option to create a jump menu. The only options that menu gives you is the same window or a frame on the page (a very outdated action looking at it now). But with basic knowledge of links you insert the menu and you will get code like:
<select name="jumpMenu" id="jumpMenu" onChange="MM_jumpMenu('parent',this,0)">
The "parent" denotes that this will open in the same window. If you change that to "blank" then it will open in a new window. A "Go" button is optional and also available in the DW GUI when you set up a jump menu.
http://www.w3schools.com/tags/att_a_target.asp -
I made a test html page using the accordion spry widget. The
first accordion is not placed in a table and the second one is.
When viewed in IE the 2nd accordion (because its placed in a table)
adds a little bit of white space between each panel so when you
click among them there is a slight jump up. Does anyone know why it
does this and how to fix it? My website is already designed and
built, so to not have it in a table this late in the game is not an
option
test page:
http://www.hsinet.com/test/test2.html.AccordionPanelClosed {
overflow:hidden;
height:39px;
Add above to your CSS -
Problems with accordion and animation
hi,
I have problems with the animation of the accordion widget
Accordion with 3 panels
panel1 no link but three subpoints with links
(for example: panel1: home, sublinks: me, you, us)
panel2 is a link with no sublinks
panel3 no link but two subpoints with links
PROBLEM:
If I turn on panel1 the animation works (there is no link on
panel1)
If I turn on panel2 the animation DON'T works (there is a
link on panel2)
what am I doing wrong that there is no animation ?
thanksSorry kimblas, you are quite right! That'll teach me not to
jump in without reading the comments :) OK, make a few changes
suggested by Steve, and played around with the css as per the
example (I think). It now works fine in Firefox if a little slow
(I'm assuming this is to do with the Flash movie and my painfully
old PC) but in IE7 it still wants to display the whole of the
selected content prior to the animation. Interestingily this wasn't
the case until I began to tinker to the recommended settings.
Unfortunately I can't get back to where it was to suss out what
code sorted it, nothing now seems to make a difference. Any
ideas? -
Spry Accordion Widget hiccups and more
Hi, I am using the Spry Accordion Widget on my website and have the following problems:
1. Is there a way for the accordion movement not to affect the images that are placed below it. For example, I have the accordion placed on top of 3 different logos. Whenever, the accordion panels move up and down (in use) all the contents (below the accordion) moves with it. I don't want the logos to move up and down whenever someone clicks on the panels. How do I make the logos stationary so its placements won't change?
I don't want to use an ap div tag because that would force my website to be in a fix position on a page. All I have been using to position my graphics are div tags and floats; no ap div tags. If you resize the browser window you will see that my website is somewhat elastic. Meaning, the graphics are always in the center of the page regardless of the size of the browser window—this is something I want to keep.
Please go here for better understanding: http://meinaco.net/tblLists.html
2. When one of the accordion tab is clicked there seems to be some kind of hiccup/jump/jerky (up and down movement) before it settles/stops. Is there a way to fix that? I noticed the accordion moves up and down smoothly prior to my inserting the images into the tab panels. To be clear, the images I am referring to are the brown horizontal lines with white words on a green background. Do these images have anything to do with this problem?
3. When the 1st tab (the restaurant panel) is open and another tab is selected, the restaurant panel displays large incorrectly styled text for a brief second as it closes to allow the other panel to open. I know it has something to do with my style sheet but I can't figure out what is causing it. I checked my css files and it seems they all have the correct size. To see this problem reoccur please do the following:
Make sure the restaurant panel is open then click on another panel (one of the 3 panels). As you click on the second panel pay attention to the text that sits inside the restaurant panel. You will see that large minus leading text will appear for a split second.
4. When I run my webpage (url mentioned above) on Safari 4.0.3 there seems to be a blue line outlining the whole accordion widget. This outline doesn't exist on Firefox nor on Opera. Please see attached image for clarity.
Any suggestions or help on any of these problems is greatly appreciated! Thank you in advance.
Meina
I hope someone can help me resolve or give me suggestions for the 1st and 2nd problems at the very least.<div class="AccordionPanelContent">Castaway the: Restaurant<br />
1250 Harvard Rd.<br />
Burbank, CA 91501<br />
- www.castawayrestaurant.com - (818) 848-6691</p>
Oops!
Missing the opening <p>
I didn't find it, the validator did.
Martin
Maybe you are looking for
-
Error while enhancing standard component CRMCMP_CND
Hi, We have one requirement that Phase Id and Offer Id needs to added in the /SAPCND/GCM transaction and the same needs to be disaplay in the web ui. So we added two fields in field catalog after that we made two implementation in /SAPCND/ROLLNAME a
-
Nokia belle toolbar and many more features
google translation hello recommendations and look forward to Slide left or right to run the toolbar toolbar NFC: on / off GPS: on / off fm transmitter: on / off -screen dial: on / off 2G/3G: mode offline: The display brightness: Click to reduce dupli
-
I bought Studio MX in 2006. I have the CD and the serial Num. but when I tried to reinstall it, it would not recognize the serial number. I registered the product in 06. Back then it was called macromedia.
-
Haven't done this in a while and am a little rusty. Need to change the ipsec site to site peer address on a tunnel, a one router is changing locations/ip address. The current cryptomap config is : crypto isakmp policy 11 encr 3des hash md5 authentica
-
My iMessage screen is locked horizontally and will not rotate. When I access the camera through iMessage it will not rotate either. Any help with this will be very much appreciated.