mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 29.03.2024 02:34 Benutzername: Passwort: Auto-Login

Thema: Akkordeon Widget & Browser Prob bei Kundin vom 15.01.2011


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Akkordeon Widget & Browser Prob bei Kundin
Seite: 1, 2  Weiter
Autor Nachricht
Arivala
Threadersteller

Dabei seit: 27.12.2010
Ort: Wien
Alter: -
Geschlecht: Weiblich
Verfasst Sa 15.01.2011 09:28
Titel

Akkordeon Widget & Browser Prob bei Kundin

Antworten mit Zitat Zum Seitenanfang

Guten Morgen zusammen!

Dank der Hilfe dieses Forums habe ich es geschafft, meine Website endlich zu finalisieren Lächel Hab jetzt nur das Problem, dass der Firefox das Spry Widget "Akkordeon" nicht korrekt anzeigt. Anstatt aufzuklappen, wenn ich eine Überschrift anklicke, öffnet sich einfach der Text unter der Überschrift und überdeckt die Überschriften darunter. Wenn ich in der Folge eine weitere Überschrift anklicke, sollte sich der Text von vorhin schließen und der andere öffnen. Doch der Text bleibt und der zweite klappt ebenfalls auf, ohne den Text darunter nach unten zu schieben. Beim IE7 funktioniert das einwandfrei.

Einer Freundin habe ich die Website zur Ansicht geschickt, bei der die Bilder untereinander stehen. Auf meinem Computer mit IE7 und Firfox sehe ich die Bilder allerdings nebeneinander, was die korrekte Darstellung ist.

Mädchen! In beiden dieser Fälle bin ich nun überfragt und habe gehofft, bei euch Hilfe zu finden.
Ich bedanke mich schon mal im Vorraus,

LG Bea
  View user's profile Private Nachricht senden
Arivala
Threadersteller

Dabei seit: 27.12.2010
Ort: Wien
Alter: -
Geschlecht: Weiblich
Verfasst Sa 15.01.2011 09:57
Titel

Vergessen

Antworten mit Zitat Zum Seitenanfang

Hab hier noch die Codes Lächel


Code:

<!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>Prunbauer Rechtsanwalts GmbH</title>
    <link href="sdfsdfsdf.css" rel="stylesheet" type="text/css" />

<script src="SpryAssets/SpryAccordion.js" type="text/javascript"></script>
<link href="SpryAssets/SpryAccordion.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="page">
        <div id="header">
            <div class="content">
                <img src="Bilder/Logo_innen.jpg" alt="Firmen Name" />
                <div id="mainmenu">
                    <div class="language">
                        <a href="home_eng.html">
                            <img src="Bilder/flagge_englisch.jpg" width="25" height="17" alt="English" />
                        </a>
                    </div>
                    <div class="content">
                        <a href="standort2.html" class="notactive">>> 777777777777 </a><a href="kontakt2.html" class="notactive">>> 666666666666</a><a
                            href="impressum2.html" class="notactive">>> 55555555555 </a>
                        <br />
                        <a href="home2.html" class="notactive">>> 11111111111111 </a><a href="gewinn2.html" class="notactive">>> 22222222222222</a><a href="klienten2.html" class="active">>> 33333333333333 </a>
                        <a href="team2.html" class="notactive">>> 444444444444 </a>
                    </div>
                </div>
            </div>
        </div>
        <div id="main">
          <div class="content">
                <h1>XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX</h1>
              <div class="content">
          <h2>
                        WIR BERATEN UND VERTRETEN</h2>
                <ul>
                           <li> xxxxxxxxxxxxxx und <br />
                           xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
                            <li> xxxxxxxxxxxxxxxxxxxxxx
                            <li>xxxxxxxxxxxxxxxxxxxxxxxxxxx
                            <li>xxxxxxxxxxxxxxxxxxxxxxxxxxx
                            <li> xxxxxxxxxxxxxxxxxxxxx
                            <li> xxxxxxxxxxxxxxxxxxxxx<br />
                            xxxxxxxxxxxxxxxxxxxxxxxx
                            <li> xxxxxxxxxxxxxxxxxxxx / xxxxxxxxxxxxxxxxx
                            <li> xxxxxxxxxxxxxxxxxxxxxx
                            <li>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx
                            <li>xxxxxxxxxxxxxxxxxxxxxxxxx
                            <li> xxxxxxxxxxxxxxxxxxxxx
                            <li>xxxxxxxxxxxxxxxxxxxxxxx</ul>
              </div>
            <div class="content">

                <h2>
                        UNSERE SCHWERPUNKTE - <br />
                      IN ALPHABETISCHER REIHENFOLGE</h2>
              <div id="Accordion1" class="Accordion" tabindex="0">
                  <div class="AccordionPanel">
                    <div class="AccordionPanelTab"> &bull; <u>xxx </u> </div>
                    <div class="AccordionPanelContent">&bull; xxx <br />
                      &bull; xxx x<br />
                      &bull; x <br />
                      &bull; xxx</div>
                  </div>
                  <div class="AccordionPanel">
                    <div class="AccordionPanelTab">&bull; <u>xxxxxxxxxxxxxxxxxx</u></div>
                    <div class="AccordionPanelContent2"> &bull; xxxxxxxxxxxxxx<br />
  &bull; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx <br />
  &bull; xxxxxxxxxxxxxxxxxxxxx <br />
  &nbsp; xxxxxxxxxxxxxxxxxxxx</div>
                  </div>
                  <div class="AccordionPanel">
                    <div class="AccordionPanelTab"> &bull; <u>xxxxxxxxxxx</u></div>
                    <div class="AccordionPanelContent3">&bull; xxxxxxxxxxxxxxxxx<br />
                      &nbsp; xxxxxxxxxxxxxxxxx  <br />
                      &nbsp;&nbsp;xxxxxxxxxxxxxxxxxxxx<br />
                      &bull; xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx <br />
                      &nbsp; xxxxxxxxxxxxxxxxx</div>
                  </div>
                  <div class="AccordionPanel">
                    <div class="AccordionPanelTab">&bull; <u>xxxxxxxxxxxxxxxxx</u></div>
                    <div class="AccordionPanelContent">&bull; xxxxxxxxxxxxxxxxxxxx<br />
                      &bull; xxxxxxxxxxxxxxxxxxxxxxxxxxxx<br />
                      &bull; xxxxxxxxxxxxxxxx <br />
                      &bull; xxxxxxxxxxxxxxxxxxx</div>
                  </div>
                  <div class="AccordionPanel">
                    <div class="AccordionPanelTab">&bull; <u>xxxxxxxxxxxxx</u><u></u></div>
                    <div class="AccordionPanelContent4"> &bull; xxxxxxxxxxxxxxxx<br />
                      &bull; xxxxxxxxxx<br />
                      &bull; xxxxxxxxxxxxxxxxxxxxx<br />
                      &bull; xxxxxxxxxxxxxx<br />
                      &nbsp; xxxxxxxxxxxxxxxxxxxxxxx<br />
                      &bull; xxxxxxxxxxxxx<br />
                      &nbsp;&nbsp;xxxxxxxxxxxx</div>
                  </div>
                  <div class="AccordionPanel">
                    <div class="AccordionPanelTab">&bull; <u>xxxxxxxxxxxxx</u></div>
                    <div class="AccordionPanelContent4"> &bull; xxxxxxxxxxxxx<br />
                      &nbsp; xxxxxxxxxxx<br />
                      &bull; xxxxxxxxxxxxxxxxxx<br />
                      &nbsp; xxxxxxxxxxxxxxxxxxxxxxxx<br />
                      &bull; xxxxxxxxxxxxxx<br />
                      &nbsp; xxxxxxxxxxx</div>
                  </div>
                  <div class="AccordionPanel">
                    <div class="AccordionPanelTab">&bull; <u>xxxxxxxxxxxx</u></div>
                    <div class="AccordionPanelContent">&bull; xxxxxxxxx<br />
                      &bull; xxxxxxxxxxxxxx<br />
                      &bull; xxxxxxxxxx</div>
                  </div>
                  <div class="AccordionPanel">
                    <div class="AccordionPanelTab">&bull; <u>xxxxxxxxxxxxx</u></div>
                    <div class="AccordionPanelContent">&bull; xxxxxxxxxxx<br />
                      &bull; xxxxxxxxx</div>
                  </div>
                  <div class="AccordionPanel">
                    <div class="AccordionPanelTab">&bull; <u>xxxx</u></div>
                    <div class="AccordionPanelContent">&bull; xxxx<br />
                      &bull; xxxxx</div>
                  </div>
                  <div class="AccordionPanel">
                    <div class="AccordionPanelTab">&bull; <u>Uxxxxx</u><u></u></div>
                    <div class="AccordionPanelContent4">&bull; xxxxxxxxxxxxxxxxx <br />
                      &bull; xxxxxxxxxxxxxxxxxxxxxxxxxxx<br />
                      &nbsp; xxxxxxxxx<br />
                      &bull; xxxxxxxxxxx<br />
                      &nbsp; xxxxxxxxxxxxxxxxxxxxxx <br />
                      &nbsp; xxxxxn <br />
                      &bull; xfghf</div>
                  </div>
                  <div class="AccordionPanel">
                    <div class="AccordionPanelTab">&bull; <u>xxxxxxxxxxxxx</u></div>
                    <div class="AccordionPanelContent">&bull; xxxxxxxxxxx<br />
                      &bull; xxxxxxxxxxxx<br />
                      &bull; xxxxxxxxxxxxx<br />
                      &nbsp; xxxxxxxxxxxxx</div>
                  </div>
              </div>
            </div>
         
          </div>
  </div>
</div>
</div>
    </div>

<script type="text/javascript">
<!--
var Accordion1 = new Spry.Widget.Accordion("Accordion1");
//-->
    </script>
</body>
</html>




Code:

.notactive {
   color: #000;
}
/* @charset "utf-8"; */


/* CSS Document */

.active {
   color: #cfd1d2;
}

#aussen {
   width: auto;
   margin: auto;
}

body
{
   margin: 0px;
   padding: 0px;
   background-color: #7c1245;
}

img
{
   /* border: solid 1px black; */
}

a:hover
{
   text-decoration: none;      
}

#page
{
   /* background-color: #7c1245; */
}

#header
{
   background-color: #FFFFFF;
   padding-top: 15px;
   padding-bottom: 15px;
   height: 76px;   
}

#header > .content
{
   width: 990px;
   margin-left: auto;
   margin-right: auto;
}

#header > .content > img
{
   width: 280px;
   height: 65px;
   float: left;
}

#mainmenu
{
   text-align: right;
   height: 76px;   
}

#mainmenu a
{
   margin-left: 10px;
   margin-right: 10px;
   display: inline-block;
   font-family: Arial, Verdana, "Trebuchet MS";
   font-size: 14px;
   text-decoration: none;
}

#mainmenu > .language
{
   margin-top: 5px;
   margin-bottom: 5px;   
}

#main
{
   font-family: Arial, Verdana, "Trebuchet MS";
   font-size: 17px;
   color: #FFF;
   line-height: 20px;
   width: 990px;
   margin-left: auto;
   margin-right: auto;
}

#main > .content
{
   display: inline-block;
}

#main > .footer
{
   display: inline-block;
   font-size: 14px;
   color: #cfd1d2;
   margin-top: 50px;
   line-height: 16px;
}

#main h1
{
   font-size: 26px;
   color: #cfd1d2;
   margin-top:50px;
}

#main h2
{
   font-size: 21px;
   color: #cfd1d2;
   margin-top: 10px;
   margin-bottom: 5px;
   text-align: left;
}

#main img
{
   cursor: text;   
}

#main > .content > .content, #main > .footer > .content
{
   text-align: left;
   float: left;
   width: 400px;
   margin-left: 47px;
   margin-right: 47px;
   display: inline-block;
   height: 600px;
}
li {
   line-height: 30px;

}


Code:

.Accordion {
   overflow: visible;
   height: 600px;
}
#Accordion1 {
   height: 600px;
}


/* 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;
   margin-top: 11px;
}

/* 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 {
   margin: 0px;
   padding: 2px;
   cursor: pointer;
   -moz-user-select: none;
   -khtml-user-select: none;
}

/* 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: visible;
   margin: 0px;
   padding: 0px;
   height: 80px;
   margin-left: 12px;
}

/* 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 {

}

/* 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 {

}
.AccordionPanelOpen .AccordionPanelTabHover {

}

/* 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 {

}

/* This is an example of how to change the appearance of the panel tab that is
 * currently open when the Accordion has focus.
 */
.AccordionFocused .AccordionPanelOpen .AccordionPanelTab {

}
.AccordionPanelContent2 {
   overflow: visible;
   margin: 0px;
   padding: 0px;
   height: 230px;
   margin-left: 12px;
}
.AccordionPanelContent3 {
   overflow: visible;
   margin: 0px;
   padding: 0px;
   height: 150px;
   margin-left: 12px;
}
.AccordionPanelContent4 {
   overflow: visible;
   margin: 0px;
   padding: 0px;
   height: 150px;
   margin-left: 12px;
}

[/code]


Zuletzt bearbeitet von Arivala am Sa 15.01.2011 09:57, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Anzeige
Anzeige
Zeithase

Dabei seit: 09.05.2005
Ort: Erfurt
Alter: 39
Geschlecht: Männlich
Verfasst Sa 15.01.2011 10:25
Titel

Antworten mit Zitat Zum Seitenanfang

Das solltest Du schon mal mitsamt allen Stylesheets und Skripten irgendwo hochladen, damit sich das irgendjemand mit zu viel Freizeit ansehen kann. Wobei ich es schon 'n bisschen dreist finde, dass Du als Laie ohne jegliche Ahnung 'ne Seite für Rechtsanwälte baust - sicherlich nicht ohne Gegenleistung - und dafür dann auch noch hier kostenlose Hilfe verlangst.

Zuletzt bearbeitet von Zeithase am Sa 15.01.2011 10:28, insgesamt 2-mal bearbeitet
  View user's profile Private Nachricht senden
Kipperlenny

Dabei seit: 20.05.2010
Ort: Preetz
Alter: 38
Geschlecht: Männlich
Verfasst Sa 15.01.2011 14:38
Titel

Antworten mit Zitat Zum Seitenanfang

Zeithase hat geschrieben:
Das solltest Du schon mal mitsamt allen Stylesheets und Skripten irgendwo hochladen, damit sich das irgendjemand mit zu viel Freizeit ansehen kann. Wobei ich es schon 'n bisschen dreist finde, dass Du als Laie ohne jegliche Ahnung 'ne Seite für Rechtsanwälte baust - sicherlich nicht ohne Gegenleistung - und dafür dann auch noch hier kostenlose Hilfe verlangst.


Wer sollte uns ausgelernten Mediengestaltern denn sonst Dumping Konkurrenz machen? Lächel


@threadersteller, kenne das spy accordion nicht - aber mit dem von jquery haben wir im betrieb noch nie probleme gehabt: http://docs.jquery.com/UI/Accordion
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Arivala
Threadersteller

Dabei seit: 27.12.2010
Ort: Wien
Alter: -
Geschlecht: Weiblich
Verfasst So 16.01.2011 08:25
Titel

Gelöst

Antworten mit Zitat Zum Seitenanfang

Die Laie hat das Problem gelöst Lächel

Bin zwar keine Mediengestalterin weils das in Österreich nicht gibt,
bin aber auch in der Druckbranche tätig.
In Österreich gibts den Druckvorstufentechniker...das hab ich gelernt.
Webdesiign hatte ich dann mal ein Seminar...also ganz so eine Laie kann ich dann
auch nicht sein...

Aber danke für die Hilfe, werd mir das anschauen.

Lg Bea
  View user's profile Private Nachricht senden
bacon

Dabei seit: 24.10.2007
Ort: -
Alter: -
Geschlecht: -
Verfasst So 16.01.2011 13:51
Titel

Antworten mit Zitat Zum Seitenanfang

Kipperlenny hat geschrieben:
Zeithase hat geschrieben:
Das solltest Du schon mal mitsamt allen Stylesheets und Skripten irgendwo hochladen, damit sich das irgendjemand mit zu viel Freizeit ansehen kann. Wobei ich es schon 'n bisschen dreist finde, dass Du als Laie ohne jegliche Ahnung 'ne Seite für Rechtsanwälte baust - sicherlich nicht ohne Gegenleistung - und dafür dann auch noch hier kostenlose Hilfe verlangst.


Wer sollte uns ausgelernten Mediengestaltern denn sonst Dumping Konkurrenz machen? Lächel


@threadersteller, kenne das spy accordion nicht - aber mit dem von jquery haben wir im betrieb noch nie probleme gehabt: http://docs.jquery.com/UI/Accordion


Auch einem "ausgebildetem mediengestalter" fehlt in der Regel die Expertise, solche Tätigkeiten auf qualitativ ausreichendem Niveau auszuführen.
  View user's profile Private Nachricht senden
Kipperlenny

Dabei seit: 20.05.2010
Ort: Preetz
Alter: 38
Geschlecht: Männlich
Verfasst So 16.01.2011 14:25
Titel

Antworten mit Zitat Zum Seitenanfang

bacon hat geschrieben:
Kipperlenny hat geschrieben:
Zeithase hat geschrieben:
Das solltest Du schon mal mitsamt allen Stylesheets und Skripten irgendwo hochladen, damit sich das irgendjemand mit zu viel Freizeit ansehen kann. Wobei ich es schon 'n bisschen dreist finde, dass Du als Laie ohne jegliche Ahnung 'ne Seite für Rechtsanwälte baust - sicherlich nicht ohne Gegenleistung - und dafür dann auch noch hier kostenlose Hilfe verlangst.


Wer sollte uns ausgelernten Mediengestaltern denn sonst Dumping Konkurrenz machen? Lächel


@threadersteller, kenne das spy accordion nicht - aber mit dem von jquery haben wir im betrieb noch nie probleme gehabt: http://docs.jquery.com/UI/Accordion


Auch einem "ausgebildetem mediengestalter" fehlt in der Regel die Expertise, solche Tätigkeiten auf qualitativ ausreichendem Niveau auszuführen.


Nun ja, ein Mediengestalter Digital ist doch genau dafür da oder? Ein Fachinformatiker wäre damit unterfordert.
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Smooth-Graphics

Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst So 16.01.2011 16:07
Titel

Antworten mit Zitat Zum Seitenanfang

Kipperlenny hat geschrieben:
bacon hat geschrieben:
Auch einem "ausgebildetem mediengestalter" fehlt in der Regel die Expertise, solche Tätigkeiten auf qualitativ ausreichendem Niveau auszuführen.

Nun ja, ein Mediengestalter Digital ist doch genau dafür da oder? Ein Fachinformatiker wäre damit unterfordert.

Klar, trotzdem kann er es meist nicht... (das wollte bacon damit sagen). Eine Ausbildung sagt gar nix...
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
 
Ähnliche Themen akkordeon effekt
Akkordeon Navigation bei App
Problem mit AS3 und Akkordeon
Dreamweaver Spry Akkordeon
akkordeon, für das letzte menü optimieren
Problem mit Jquery Akkordeon Menü
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.