Umbau auf mobil

Offtopic - Hier könnt ihr über alles, was nirgendswo mehr reinpasst, plaudern!
Antworten
Benutzeravatar
moni
Held des Forums
Held des Forums
Beiträge: 8363
Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken

Re: Umbau auf mobil

Beitrag von moni »

Danke Jürg und Olaf für Rückmeldung ...
Ja das stimmt hab noch Viel Arbeit und alle die Bilder hoch laden ...und -verlinken. Auch die viel JS usw ...ist mehr Arbeit als ich dachte ...
Wegen die Link-liste Jürg da ist ein sehr. Einfachen php Skript ...und glaub suche mir eine andren ,so richtig bin mit den nicht zufrieden und einstellen kann den auch so gut wie gar nicht ..

An deine frage Jürg ...ich weiß nicht ob es schwer war ,ich bin neugierig und hatte sehr lange an den System geforscht und überhaupt zu verstehen um w geht bei den mobilen Sachen ...habe mir für ein sehr simple Version entschieden und auf diese Basis kann ich weitere Entwickeln .. Zweispaltig oder drei Spaltung ..aber für mein HP bleibt erst mal einspaltig ....
es ist auch klar es wäre für mich einfacher und schneller WP oder was anders fertiges zu installieren ,es ist wie mit eine selbst gemachte Marmelade :D ..die sieht nicht Immer perfekt aus aber man geniest sie einfach ...ist blöde Beispiel . :D ..ich freu mich das ich was neues gelernt habe da sind die Strapazen dann auch nicht so doll :D

Muss mich nur gedulden wegen meine Schnecken Tempo !

----
das Gästebuch kann man wieder abrufen ..leider ist mir durch erneuten installieren ein Beitrag vom Peter verloren :shock:
Viele Grüße ...Monika
Benutzeravatar
thaileben
Moderator
Moderator
Beiträge: 7772
Registriert: So 26. Sep 2010, 03:47
Mein Vorname: Jürg
Wohnort: nahe Ubon Ratchathani / Thailand
Kontaktdaten:

Re: Umbau auf mobil

Beitrag von thaileben »

Danke für die antwort Moni
das Marmeladenbeispiel finde ich irgendwie süss :D
Ich forsche auch schon länger verstehe allerdings nix beziehungsweise bleibt nicht in meinem kopf

Jürg :X
Benutzeravatar
moni
Held des Forums
Held des Forums
Beiträge: 8363
Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken

Re: Umbau auf mobil

Beitrag von moni »

thaileben hat geschrieben:Danke für die antwort Moni
das Marmeladenbeispiel finde ich irgendwie süss :D
Ich forsche auch schon länger verstehe allerdings nix beziehungsweise bleibt nicht in meinem kopf

Jürg :X
:D
Jürg .. es ist auch sehr viel was man sich merken muss , und auf gesunden Menschen verstand kann man sich das auch gut ersparen können :) ( aber ..wie gesagt das süße lockt einen ein :D )

Man kann auch auf einfacher Art und weise eine gute HP erstellen !
----------

so habe einen klein Problem und brauche einen Tipp von euch ! ...und zwar mit Hilfe vom tab Formularen habe eine Seite erstellt und alles so weit gut geklappt ..leider die navi leiste bei ausfallen versteckt sich hinten die tabs ...

Bild


habe schon sämtliche css Dateien nach geprüft und doppelten angaben weggemacht ...ansonsten da weiß keine Rat dazu :E :E




http://www.blicke1.de/html/html.php
Viele Grüße ...Monika
Benutzeravatar
Jasko
Globaler Moderator
Globaler Moderator
Beiträge: 3294
Registriert: Di 21. Feb 2012, 06:59
Mein Vorname: Jasmin
Wohnort: Wien
Kontaktdaten:

Re: Umbau auf mobil

Beitrag von Jasko »

Hallo moni,

Ist dein tab Formular mit hilfe von javascript erstellt worden?

Wenn ja ist watscheinlich irgendwo im js ein z-index Attribut eingebaut so das das Formular im Vordergund bleibt.

Die Lösung sollte somit einfach sein und zwar deinem aufklappmenü einen höheren z-index verpassen (in deiner CSS).

LG
Zuletzt geändert von Jasko am Do 25. Jun 2015, 12:03, insgesamt 1-mal geändert.
Grund: kleine Info hinzugefühgt
Benutzeravatar
moni
Held des Forums
Held des Forums
Beiträge: 8363
Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken

Re: Umbau auf mobil

Beitrag von moni »

Danke Jasko für dein Tipp...

Ja die tabs sind mit JS betrieben habe das Skript bei den Klikstart gefunden http://www.99lime.com/elements/


und die navi leiste hier ist das vom Jquery ..könnte leider das Z-Index Attribut nicht finden .. :E

oder kann man den einfach so zufügen ?

http://code.jquery.com/jquery-latest.min.js
und hier das zweiten Java skript

Code: Alles auswählen

(function($) {

  $.fn.menumaker = function(options) {
      
      var cssmenu = $(this), settings = $.extend({
        title: "Menu",
        format: "dropdown",
        breakpoint: 768,
        sticky: false
      }, options);

      return this.each(function() {
        cssmenu.find('li ul').parent().addClass('has-sub');
        if (settings.format != 'select') {
          cssmenu.prepend('<div id="menu-button">' + settings.title + '</div>');
          $(this).find("#menu-button").on('click', function(){
            $(this).toggleClass('menu-opened');
            var mainmenu = $(this).next('ul');
            if (mainmenu.hasClass('open')) { 
              mainmenu.hide().removeClass('open');
            }
            else {
              mainmenu.show().addClass('open');
              if (settings.format === "dropdown") {
                mainmenu.find('ul').show();
              }
            }
          });

          multiTg = function() {
            cssmenu.find(".has-sub").prepend('<span class="submenu-button"></span>');
            cssmenu.find('.submenu-button').on('click', function() {
              $(this).toggleClass('submenu-opened');
              if ($(this).siblings('ul').hasClass('open')) {
                $(this).siblings('ul').removeClass('open').hide();
              }
              else {
                $(this).siblings('ul').addClass('open').show();
              }
            });
          };

          if (settings.format === 'multitoggle') multiTg();
          else cssmenu.addClass('dropdown');
        }

        else if (settings.format === 'select')
        {
          cssmenu.append('<select style="width: 100%"/>').addClass('select-list');
          var selectList = cssmenu.find('select');
          selectList.append('<option>' + settings.title + '</option>', {
                                                         "selected": "selected",
                                                         "value": ""});
          cssmenu.find('a').each(function() {
            var element = $(this), indentation = "";
            for (i = 1; i < element.parents('ul').length; i++)
            {
              indentation += '-';
            }
            selectList.append('<option value="' + $(this).attr('href') + '">' + indentation + element.text() + '</option');
          });
          selectList.on('change', function() {
            window.location = $(this).find("option:selected").val();
          });
        }

        if (settings.sticky === true) cssmenu.css('position', 'fixed');

        resizeFix = function() {
          if ($(window).width() > settings.breakpoint) {
            cssmenu.find('ul').show();
            cssmenu.removeClass('small-screen');
            if (settings.format === 'select') {
              cssmenu.find('select').hide();
            }
            else {
              cssmenu.find("#menu-button").removeClass("menu-opened");
            }
          }

          if ($(window).width() <= settings.breakpoint && !cssmenu.hasClass("small-screen")) {
            cssmenu.find('ul').hide().removeClass('open');
            cssmenu.addClass('small-screen');
            if (settings.format === 'select') {
              cssmenu.find('select').show();
            }
          }
        };
        resizeFix();
        return $(window).on('resize', resizeFix);

      });
  };
})(jQuery);

(function($){
$(document).ready(function(){

$(document).ready(function() {
  $("#cssmenu").menumaker({
    title: "Menu",
    format: "dropdown"
  });

  $("#cssmenu a").each(function() {
  	var linkTitle = $(this).text();
  	$(this).attr('data-title', linkTitle);
  });
});

});
})(jQuery);
Viele Grüße ...Monika
Benutzeravatar
moni
Held des Forums
Held des Forums
Beiträge: 8363
Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken

Re: Umbau auf mobil

Beitrag von moni »

Guten morgen ...

Das Problem mit den Tabs habe ich gelöst ,wo ich den Tipp vom jasko gefolgt hatte und z-index eingeführt habe ,aber nicht in den JS sondern in CSS ...Vom JS verstehe ich ja nicht viel und dachte mir in den CSS kannst ja versuchen ..zum Glück hat´s eingehauen :) ..

dazu auch ein andre navi leiste eingebaut , die gefällt mir besser weil auf mobil nicht so in die Länge geht .

hier das Effekt
Bild

mein nächsten Problem und frage ist : wie bekomme ich das mir das Skript Text aus dem rammen nicht raus springt ??
..es geht aber nur um die Skript was ich da präsentiere ...restliche Text passt gut rein ..
habe schon rescheschiert ....leider ohne Erfolg ...

für ein Tipp wäre ich sehr dankbar !!!!

Bild


zu Letzt will euch meinen 2 neuen Bannern zeigen,und auch bei Katharina herzlich bedanken das sie mir den erstellt hatte .

vielen Lieben Dank Kahtrina für Tolle Arbeit und deine Zeit . :DA :DA

wer jemanden möchte kann meinen alten Banner tauschen .


Bild
Bild
Zuletzt geändert von moni am Do 25. Jun 2015, 20:57, insgesamt 1-mal geändert.
Viele Grüße ...Monika
Benutzeravatar
Jasko
Globaler Moderator
Globaler Moderator
Beiträge: 3294
Registriert: Di 21. Feb 2012, 06:59
Mein Vorname: Jasmin
Wohnort: Wien
Kontaktdaten:

Re: Umbau auf mobil

Beitrag von Jasko »

moni hat geschrieben:Guten morgen ...

Das Problem mit den Tabs habe ich gelöst ,wo ich den Tipp vom jasko gefolgt hatte und z-index eingeführt habe ,aber nicht in den JS sondern in CSS ...Vom JS verstehe ich ja nicht viel und dachte mir in den CSS kannst ja versuchen ..zum Glück hat´s eingehauen :) ..
Hallo moni,

super das es geklappt hat. Ich dachte auch das man den z-index im CSS einstellen soll, leider nicht dazu geschrieben :( , den JS manipuliert nur die CSS in dem es z.B. ein z-index zur Laufzeit hinzufühgt. Der z-index muss auch nicht im eigentlichen Code sein der kann auch in den Bibliotheken die JS nutzt versteckt sein so das man den nicht finden bzw. nicht bearbeiten kann, aber man kann immer seine CSS bearbeiten wie du es selbst gemacht hast und so das ganze richtig einstellen.

zu deiner jetzigen Frage. Ich denke du musst wieder an die CSS ran und die Größe deine Code-Box flexibel gestallten, das diese mit der jeweiligen Auflösung mitgeht, probier mal, wenn es nicht geht schaun wir mal weiter. Ach ganz wichtig das gilt auch für die Schriftgröße, diese sollte man nicht mit pixel also "px" definieren sondern mit "em". Wobei ich denke das auf dieser Seite noch andere Fehler noch versteckt sind so wie es im Quelltext aussieht.

LG
Benutzeravatar
moni
Held des Forums
Held des Forums
Beiträge: 8363
Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken

Re: Umbau auf mobil

Beitrag von moni »

Danke jasko für deine Antwort ..probiere das und melde mich dann !
Viele Grüße ...Monika
Benutzeravatar
moni
Held des Forums
Held des Forums
Beiträge: 8363
Registriert: Mo 16. Nov 2009, 20:56
Mein Vorname: Monika
Wohnort: Borken

Re: Umbau auf mobil

Beitrag von moni »

Hallo Jasko ...

habe einen Code Box gemacht ,das man den besser sieht das HD in Farbe .... auf 80% breite und auch noch 2% Abstand und in den eigentlichen Text Box eingeführt ..es ist alles schön und gut so lange ich keinen Skript rein füge ... :E

Schrift hab ich von vor alles in den em gemacht ..die navi leiste ist fertig vom Jquery und sehe eben das px angaben drin sind ...

An Fehler ..muss die falsch verlinkten Bilder und Kleinigkeiten korrigieren ... auch diesen klick Start System installiert und anschneiden stimmt da nicht alles ... werde das nachprüfen ..

oder hast was anderes gemeint ?

http://www.blicke1.de/home/code-box.php


Bild Bild

we en Fehler an mein HP ..habe ein paar Gestaltung fehle drin
Viele Grüße ...Monika
Benutzeravatar
Jasko
Globaler Moderator
Globaler Moderator
Beiträge: 3294
Registriert: Di 21. Feb 2012, 06:59
Mein Vorname: Jasmin
Wohnort: Wien
Kontaktdaten:

Re: Umbau auf mobil

Beitrag von Jasko »

Beim Code ist bekommt man ein Problem weil man in einer Zeile ein Risiges Wort hat, jedenfals wird das vom Browser so erkannt weil keine Leerstellen zwischen den Wörtern sind, aber dafür gibt es einen kleinen Trick mit CSS:

Code: Alles auswählen

.code-box{
	overflow:hidden;
}
somit werden die überhänge versteckt und alles sieht wieder gut aus.

LG
Antworten

Wer ist online?

Mitglieder in diesem Forum: 0 Mitglieder und 1 Gast