Hallo, Gast
Sie müssen sich registrieren bevor Sie auf unserer Seite Beiträge schreiben können.

Benutzername/E-Mail:
  

Passwort
  





Durchsuche Foren

(Erweiterte Suche)

Foren-Statistiken
» Mitglieder: 54
» Neuestes Mitglied: Neo000
» Foren-Themen: 54
» Foren-Beiträge: 168

Komplettstatistiken

Benutzer Online
Momentan sind 4 Benutzer online
» 0 Mitglieder
» 4 Gäste

Aktive Themen
2 Menüs in ein Hamburger ...
Forum: Bootstrap 3
Letzter Beitrag: The-Error
16.09.2017, 12:14
» Antworten: 3
» Ansichten: 47
Formular versendet keine ...
Forum: Bootstrap 3
Letzter Beitrag: The-Error
12.09.2017, 14:05
» Antworten: 1
» Ansichten: 38
Bootstrap 4 Beta veröffen...
Forum: Bootstrap 4
Letzter Beitrag: The-Error
13.08.2017, 14:14
» Antworten: 0
» Ansichten: 106
Bootsnipp Slider
Forum: Bootstrap 3
Letzter Beitrag: The-Error
21.07.2017, 16:49
» Antworten: 1
» Ansichten: 206
Mehrsprachiges Menü
Forum: Hilfe - Häufig gestellte Fragen
Letzter Beitrag: The-Error
18.07.2017, 11:37
» Antworten: 0
» Ansichten: 198
Panel mit Navigation
Forum: Hilfe - Häufig gestellte Fragen
Letzter Beitrag: The-Error
06.07.2017, 11:15
» Antworten: 0
» Ansichten: 205
Grid-System (Raster) in B...
Forum: Bootstrap 4
Letzter Beitrag: The-Error
28.06.2017, 11:41
» Antworten: 0
» Ansichten: 249
Collapsed Navbar schließt...
Forum: Bootstrap 3
Letzter Beitrag: The-Error
22.06.2017, 16:47
» Antworten: 1
» Ansichten: 397
Favicon für Bootstrap-For...
Forum: Smalltalk
Letzter Beitrag: The-Error
22.06.2017, 15:55
» Antworten: 1
» Ansichten: 373
Bootstrap 3 für Anfänger
Forum: Bootstrap 4
Letzter Beitrag: The-Error
15.06.2017, 07:08
» Antworten: 1
» Ansichten: 361

 
  2 Menüs in ein Hamburger verpacken
Geschrieben von: Neo000 - 15.09.2017, 22:58 - Forum: Bootstrap 3 - Antworten (3)

Hallo,

habe ein kleines Problem. Ich möchte 2 Menüs in einer Leiste verstecken. Leider bekomme ich es nur in 2 Menüleisten hin. Siehe Bild

Möchte es aber nur in einem Menü haben. Vllt kann mir mal jemand helfen dabei?



[img][Bild: so2msf2t.png][/img]

Drucke diesen Beitrag

  Formular versendet keine Umlaule
Geschrieben von: andres - 12.09.2017, 09:55 - Forum: Bootstrap 3 - Antworten (1)

Hallo
Ich habe eine bootstrap agency theme am laufen (http://www.psychotherapie-passweg.ch/) am laufen.
Das Formular vesendet keine Umlaute. Im Moment läuft php 5.6.
Konnte das der Grund sein?
Muss ich eine Datei abändern?
Bin leider kein php Kenner.
Weiss jemand Rat?
Besten Dank.


PHP-Code:
<?php
header
("Content-Type: text/html; charset=utf-8");

// Check for empty fields
if(empty($_POST['name'])      ||
 
  empty($_POST['email'])     ||
 
  empty($_POST['phone'])     ||
 
  empty($_POST['message'])   ||
 
  !filter_var($_POST['email'],FILTER_VALIDATE_EMAIL))
 
  {
 
  echo "No arguments Provided!";
 
  return false;
 
  }
 
  
$name 
strip_tags(htmlspecialchars($_POST['name']));
$email_address strip_tags(htmlspecialchars($_POST['email']));
$phone strip_tags(htmlspecialchars($_POST['phone']));
$message strip_tags(htmlspecialchars($_POST['message']));
 
  
// Create the email and send the message
$to 'info@domain.ch'// Add your email address inbetween the '' replacing yourname@yourdomain.com - This is where the form will send a message to.
$email_subject "Mitteilung von:  $name";
$email_body "Jemand hat eine Nachricht von ihrer Website versendet. \n\n"."Hier die Angaben:\n\nName: $name\n\nEmail: $email_address\n\nTelefon: $phone\n\nNachricht:\n$message";
$headers "From: noreply@psychotherapie-passweg.ch\n"// This is the email address the generated message will be from. We recommend using something like noreply@yourdomain.com.
$headers .= "Reply-To: $email_address \n"  
$headers 
.= 'Content-type: text/plain; charset=UTF-8' "\n";
mail($to,$email_subject,$email_body,$headers);
return 
true        
?>

Code:
/* jqBootstrapValidation

* A plugin for automating validation on Twitter Bootstrap formatted forms.
*
* v1.3.6
*
* License: MIT <http://opensource.org/licenses/mit-license.php> - see LICENSE file
*
* http://ReactiveRaven.github.com/jqBootstrapValidation/
*/

(function( $ ){

    var createdElements = [];

    var defaults = {
        options: {
            prependExistingHelpBlock: false,
            sniffHtml: true, // sniff for 'required', 'maxlength', etc
            preventSubmit: true, // stop the form submit event from firing if validation fails
            submitError: false, // function called if there is an error when trying to submit
            submitSuccess: false, // function called just before a successful submit event is sent to the server
           semanticallyStrict: false, // set to true to tidy up generated HTML output
            autoAdd: {
                helpBlocks: true
            },
           filter: function () {
               // return $(this).is(":visible"); // only validate elements you can see
               return true; // validate everything
           }
        },
   methods: {
     init : function( options ) {

       var settings = $.extend(true, {}, defaults);

       settings.options = $.extend(true, settings.options, options);

       var $siblingElements = this;

       var uniqueForms = $.unique(
         $siblingElements.map( function () {
           return $(this).parents("form")[0];
         }).toArray()
       );

       $(uniqueForms).bind("submit", function (e) {
         var $form = $(this);
         var warningsFound = 0;
         var $inputs = $form.find("input,textarea,select").not("[type=submit],[type=image]").filter(settings.options.filter);
         $inputs.trigger("submit.validation").trigger("validationLostFocus.validation");

         $inputs.each(function (i, el) {
           var $this = $(el),
             $controlGroup = $this.parents(".form-group").first();
           if (
             $controlGroup.hasClass("warning")
           ) {
             $controlGroup.removeClass("warning").addClass("error");
             warningsFound++;
           }
         });

         $inputs.trigger("validationLostFocus.validation");

         if (warningsFound) {
           if (settings.options.preventSubmit) {
             e.preventDefault();
           }
           $form.addClass("error");
           if ($.isFunction(settings.options.submitError)) {
             settings.options.submitError($form, e, $inputs.jqBootstrapValidation("collectErrors", true));
           }
         } else {
           $form.removeClass("error");
           if ($.isFunction(settings.options.submitSuccess)) {
             settings.options.submitSuccess($form, e);
           }
         }
       });

       return this.each(function(){

         // Get references to everything we're interested in
         var $this = $(this),
           $controlGroup = $this.parents(".form-group").first(),
           $helpBlock = $controlGroup.find(".help-block").first(),
           $form = $this.parents("form").first(),
           validatorNames = [];

         // create message container if not exists
         if (!$helpBlock.length && settings.options.autoAdd && settings.options.autoAdd.helpBlocks) {
             $helpBlock = $('<div class="help-block" />');
             $controlGroup.find('.controls').append($helpBlock);
                            createdElements.push($helpBlock[0]);
         }

         // =============================================================
         //                                     SNIFF HTML FOR VALIDATORS
         // =============================================================

         // *snort sniff snuffle*

         if (settings.options.sniffHtml) {
           var message = "";
           // ---------------------------------------------------------
           //                                                   PATTERN
           // ---------------------------------------------------------
           if ($this.attr("pattern") !== undefined) {
             message = "Not in the expected format<!-- data-validation-pattern-message to override -->";
             if ($this.data("validationPatternMessage")) {
               message = $this.data("validationPatternMessage");
             }
             $this.data("validationPatternMessage", message);
             $this.data("validationPatternRegex", $this.attr("pattern"));
           }
           // ---------------------------------------------------------
           //                                                       MAX
           // ---------------------------------------------------------
           if ($this.attr("max") !== undefined || $this.attr("aria-valuemax") !== undefined) {
             var max = ($this.attr("max") !== undefined ? $this.attr("max") : $this.attr("aria-valuemax"));
             message = "Too high: Maximum of '" + max + "'<!-- data-validation-max-message to override -->";
             if ($this.data("validationMaxMessage")) {
               message = $this.data("validationMaxMessage");
             }
             $this.data("validationMaxMessage", message);
             $this.data("validationMaxMax", max);
           }
           // ---------------------------------------------------------
           //                                                       MIN
           // ---------------------------------------------------------
           if ($this.attr("min") !== undefined || $this.attr("aria-valuemin") !== undefined) {
             var min = ($this.attr("min") !== undefined ? $this.attr("min") : $this.attr("aria-valuemin"));
             message = "Too low: Minimum of '" + min + "'<!-- data-validation-min-message to override -->";
             if ($this.data("validationMinMessage")) {
               message = $this.data("validationMinMessage");
             }
             $this.data("validationMinMessage", message);
             $this.data("validationMinMin", min);
           }
           // ---------------------------------------------------------
           //                                                 MAXLENGTH
           // ---------------------------------------------------------
           if ($this.attr("maxlength") !== undefined) {
             message = "Too long: Maximum of '" + $this.attr("maxlength") + "' characters<!-- data-validation-maxlength-message to override -->";
             if ($this.data("validationMaxlengthMessage")) {
               message = $this.data("validationMaxlengthMessage");
             }
             $this.data("validationMaxlengthMessage", message);
             $this.data("validationMaxlengthMaxlength", $this.attr("maxlength"));
           }
           // ---------------------------------------------------------
           //                                                 MINLENGTH
           // ---------------------------------------------------------
           if ($this.attr("minlength") !== undefined) {
             message = "Too short: Minimum of '" + $this.attr("minlength") + "' characters<!-- data-validation-minlength-message to override -->";
             if ($this.data("validationMinlengthMessage")) {
               message = $this.data("validationMinlengthMessage");
             }
             $this.data("validationMinlengthMessage", message);
             $this.data("validationMinlengthMinlength", $this.attr("minlength"));
           }
           // ---------------------------------------------------------
           //                                                  REQUIRED
           // ---------------------------------------------------------
           if ($this.attr("required") !== undefined || $this.attr("aria-required") !== undefined) {
             message = settings.builtInValidators.required.message;
             if ($this.data("validationRequiredMessage")) {
               message = $this.data("validationRequiredMessage");
             }
             $this.data("validationRequiredMessage", message);
           }
           // ---------------------------------------------------------
           //                                                    NUMBER
           // ---------------------------------------------------------
           if ($this.attr("type") !== undefined && $this.attr("type").toLowerCase() === "number") {
             message = settings.builtInValidators.number.message;
             if ($this.data("validationNumberMessage")) {
               message = $this.data("validationNumberMessage");
             }
             $this.data("validationNumberMessage", message);
           }
           // ---------------------------------------------------------
           //                                                     EMAIL
           // ---------------------------------------------------------
           if ($this.attr("type") !== undefined && $this.attr("type").toLowerCase() === "email") {
             message = "Keine gültige Email Adresse<!-- data-validator-validemail-message to override -->";
             if ($this.data("validationValidemailMessage")) {
               message = $this.data("validationValidemailMessage");
             } else if ($this.data("validationEmailMessage")) {
               message = $this.data("validationEmailMessage");
             }
             $this.data("validationValidemailMessage", message);
           }
           // ---------------------------------------------------------
           //                                                MINCHECKED
           // ---------------------------------------------------------
           if ($this.attr("minchecked") !== undefined) {
             message = "Not enough options checked; Minimum of '" + $this.attr("minchecked") + "' required<!-- data-validation-minchecked-message to override -->";
             if ($this.data("validationMincheckedMessage")) {
               message = $this.data("validationMincheckedMessage");
             }
             $this.data("validationMincheckedMessage", message);
             $this.data("validationMincheckedMinchecked", $this.attr("minchecked"));
           }
           // ---------------------------------------------------------
           //                                                MAXCHECKED
           // ---------------------------------------------------------
           if ($this.attr("maxchecked") !== undefined) {
             message = "Too many options checked; Maximum of '" + $this.attr("maxchecked") + "' required<!-- data-validation-maxchecked-message to override -->";
             if ($this.data("validationMaxcheckedMessage")) {
               message = $this.data("validationMaxcheckedMessage");
             }
             $this.data("validationMaxcheckedMessage", message);
             $this.data("validationMaxcheckedMaxchecked", $this.attr("maxchecked"));
           }
         }

         // =============================================================
         //                                       COLLECT VALIDATOR NAMES
         // =============================================================

         // Get named validators
         if ($this.data("validation") !== undefined) {
           validatorNames = $this.data("validation").split(",");
         }

         // Get extra ones defined on the element's data attributes
         $.each($this.data(), function (i, el) {
           var parts = i.replace(/([A-Z])/g, ",$1").split(",");
           if (parts[0] === "validation" && parts[1]) {
             validatorNames.push(parts[1]);
           }
         });

         // =============================================================
         //                                     NORMALISE VALIDATOR NAMES
         // =============================================================

         var validatorNamesToInspect = validatorNames;
         var newValidatorNamesToInspect = [];

         do // repeatedly expand 'shortcut' validators into their real validators
         {
           // Uppercase only the first letter of each name
           $.each(validatorNames, function (i, el) {
             validatorNames[i] = formatValidatorName(el);
           });

           // Remove duplicate validator names
           validatorNames = $.unique(validatorNames);

           // Pull out the new validator names from each shortcut
           newValidatorNamesToInspect = [];
           $.each(validatorNamesToInspect, function(i, el) {
             if ($this.data("validation" + el + "Shortcut") !== undefined) {
               // Are these custom validators?
               // Pull them out!
               $.each($this.data("validation" + el + "Shortcut").split(","), function(i2, el2) {
                 newValidatorNamesToInspect.push(el2);
               });
             } else if (settings.builtInValidators[el.toLowerCase()]) {
               // Is this a recognised built-in?
               // Pull it out!
               var validator = settings.builtInValidators[el.toLowerCase()];
               if (validator.type.toLowerCase() === "shortcut") {
                 $.each(validator.shortcut.split(","), function (i, el) {
                   el = formatValidatorName(el);
                   newValidatorNamesToInspect.push(el);
                   validatorNames.push(el);
                 });
               }
             }
           });

           validatorNamesToInspect = newValidatorNamesToInspect;

         } while (validatorNamesToInspect.length > 0)

         // =============================================================
         //                                       SET UP VALIDATOR ARRAYS
         // =============================================================

         var validators = {};

         $.each(validatorNames, function (i, el) {
           // Set up the 'override' message
           var message = $this.data("validation" + el + "Message");
           var hasOverrideMessage = (message !== undefined);
           var foundValidator = false;
           message =
             (
               message
                 ? message
                 : "'" + el + "' validation failed <!-- Add attribute 'data-validation-" + el.toLowerCase() + "-message' to input to change this message -->"
             )
           ;

           $.each(
             settings.validatorTypes,
             function (validatorType, validatorTemplate) {
               if (validators[validatorType] === undefined) {
                 validators[validatorType] = [];
               }
               if (!foundValidator && $this.data("validation" + el + formatValidatorName(validatorTemplate.name)) !== undefined) {
                 validators[validatorType].push(
                   $.extend(
                     true,
                     {
                       name: formatValidatorName(validatorTemplate.name),
                       message: message
                     },
                     validatorTemplate.init($this, el)
                   )
                 );
                 foundValidator = true;
               }
             }
           );

           if (!foundValidator && settings.builtInValidators[el.toLowerCase()]) {

             var validator = $.extend(true, {}, settings.builtInValidators[el.toLowerCase()]);
             if (hasOverrideMessage) {
               validator.message = message;
             }
             var validatorType = validator.type.toLowerCase();

             if (validatorType === "shortcut") {
               foundValidator = true;
             } else {
               $.each(
                 settings.validatorTypes,
                 function (validatorTemplateType, validatorTemplate) {
                   if (validators[validatorTemplateType] === undefined) {
                     validators[validatorTemplateType] = [];
                   }
                   if (!foundValidator && validatorType === validatorTemplateType.toLowerCase()) {
                     $this.data("validation" + el + formatValidatorName(validatorTemplate.name), validator[validatorTemplate.name.toLowerCase()]);
                     validators[validatorType].push(
                       $.extend(
                         validator,
                         validatorTemplate.init($this, el)
                       )
                     );
                     foundValidator = true;
                   }
                 }
               );
             }
           }

           if (! foundValidator) {
             $.error("Cannot find validation info for '" + el + "'");
           }
         });

         // =============================================================
         //                                         STORE FALLBACK VALUES
         // =============================================================

         $helpBlock.data(
           "original-contents",
           (
             $helpBlock.data("original-contents")
               ? $helpBlock.data("original-contents")
               : $helpBlock.html()
           )
         );

         $helpBlock.data(
           "original-role",
           (
             $helpBlock.data("original-role")
               ? $helpBlock.data("original-role")
               : $helpBlock.attr("role")
           )
         );

         $controlGroup.data(
           "original-classes",
           (
             $controlGroup.data("original-clases")
               ? $controlGroup.data("original-classes")
               : $controlGroup.attr("class")
           )
         );

         $this.data(
           "original-aria-invalid",
           (
             $this.data("original-aria-invalid")
               ? $this.data("original-aria-invalid")
               : $this.attr("aria-invalid")
           )
         );

         // =============================================================
         //                                                    VALIDATION
         // =============================================================

         $this.bind(
           "validation.validation",
           function (event, params) {

             var value = getValue($this);

             // Get a list of the errors to apply
             var errorsFound = [];

             $.each(validators, function (validatorType, validatorTypeArray) {
               if (value || value.length || (params && params.includeEmpty) || (!!settings.validatorTypes[validatorType].blockSubmit && params && !!params.submitting)) {
                 $.each(validatorTypeArray, function (i, validator) {
                   if (settings.validatorTypes[validatorType].validate($this, value, validator)) {
                     errorsFound.push(validator.message);
                   }
                 });
               }
             });

             return errorsFound;
           }
         );

         $this.bind(
           "getValidators.validation",
           function () {
             return validators;
           }
         );

         // =============================================================
         //                                             WATCH FOR CHANGES
         // =============================================================
         $this.bind(
           "submit.validation",
           function () {
             return $this.triggerHandler("change.validation", {submitting: true});
           }
         );
         $this.bind(
           [
             "keyup",
             "focus",
             "blur",
             "click",
             "keydown",
             "keypress",
             "change"
           ].join(".validation ") + ".validation",
           function (e, params) {

             var value = getValue($this);

             var errorsFound = [];

             $controlGroup.find("input,textarea,select").each(function (i, el) {
               var oldCount = errorsFound.length;
               $.each($(el).triggerHandler("validation.validation", params), function (j, message) {
                 errorsFound.push(message);
               });
               if (errorsFound.length > oldCount) {
                 $(el).attr("aria-invalid", "true");
               } else {
                 var original = $this.data("original-aria-invalid");
                 $(el).attr("aria-invalid", (original !== undefined ? original : false));
               }
             });

             $form.find("input,select,textarea").not($this).not("[name=\"" + $this.attr("name") + "\"]").trigger("validationLostFocus.validation");

             errorsFound = $.unique(errorsFound.sort());

             // Were there any errors?
             if (errorsFound.length) {
               // Better flag it up as a warning.
               $controlGroup.removeClass("success error").addClass("warning");

               // How many errors did we find?
               if (settings.options.semanticallyStrict && errorsFound.length === 1) {
                 // Only one? Being strict? Just output it.
                 $helpBlock.html(errorsFound[0] +
                   ( settings.options.prependExistingHelpBlock ? $helpBlock.data("original-contents") : "" ));
               } else {
                 // Multiple? Being sloppy? Glue them together into an UL.
                 $helpBlock.html("<ul role=\"alert\"><li>" + errorsFound.join("</li><li>") + "</li></ul>" +
                   ( settings.options.prependExistingHelpBlock ? $helpBlock.data("original-contents") : "" ));
               }
             } else {
               $controlGroup.removeClass("warning error success");
               if (value.length > 0) {
                 $controlGroup.addClass("success");
               }
               $helpBlock.html($helpBlock.data("original-contents"));
             }

             if (e.type === "blur") {
               $controlGroup.removeClass("success");
             }
           }
         );
         $this.bind("validationLostFocus.validation", function () {
           $controlGroup.removeClass("success");
         });
       });
     },
     destroy : function( ) {

       return this.each(
         function() {

           var
             $this = $(this),
             $controlGroup = $this.parents(".form-group").first(),
             $helpBlock = $controlGroup.find(".help-block").first();

           // remove our events
           $this.unbind('.validation'); // events are namespaced.
           // reset help text
           $helpBlock.html($helpBlock.data("original-contents"));
           // reset classes
           $controlGroup.attr("class", $controlGroup.data("original-classes"));
           // reset aria
           $this.attr("aria-invalid", $this.data("original-aria-invalid"));
           // reset role
           $helpBlock.attr("role", $this.data("original-role"));
                        // remove all elements we created
                        if (createdElements.indexOf($helpBlock[0]) > -1) {
                            $helpBlock.remove();
                        }

         }
       );

     },
     collectErrors : function(includeEmpty) {

       var errorMessages = {};
       this.each(function (i, el) {
         var $el = $(el);
         var name = $el.attr("name");
         var errors = $el.triggerHandler("validation.validation", {includeEmpty: true});
         errorMessages[name] = $.extend(true, errors, errorMessages[name]);
       });

       $.each(errorMessages, function (i, el) {
         if (el.length === 0) {
           delete errorMessages[i];
         }
       });

       return errorMessages;

     },
     hasErrors: function() {

       var errorMessages = [];

       this.each(function (i, el) {
         errorMessages = errorMessages.concat(
           $(el).triggerHandler("getValidators.validation") ? $(el).triggerHandler("validation.validation", {submitting: true}) : []
         );
       });

       return (errorMessages.length > 0);
     },
     override : function (newDefaults) {
       defaults = $.extend(true, defaults, newDefaults);
     }
   },
        validatorTypes: {
     callback: {
       name: "callback",
       init: function ($this, name) {
         return {
           validatorName: name,
           callback: $this.data("validation" + name + "Callback"),
           lastValue: $this.val(),
           lastValid: true,
           lastFinished: true
         };
       },
       validate: function ($this, value, validator) {
         if (validator.lastValue === value && validator.lastFinished) {
           return !validator.lastValid;
         }

         if (validator.lastFinished === true)
         {
           validator.lastValue = value;
           validator.lastValid = true;
           validator.lastFinished = false;

           var rrjqbvValidator = validator;
           var rrjqbvThis = $this;
           executeFunctionByName(
             validator.callback,
             window,
             $this,
             value,
             function (data) {
               if (rrjqbvValidator.lastValue === data.value) {
                 rrjqbvValidator.lastValid = data.valid;
                 if (data.message) {
                   rrjqbvValidator.message = data.message;
                 }
                 rrjqbvValidator.lastFinished = true;
                 rrjqbvThis.data("validation" + rrjqbvValidator.validatorName + "Message", rrjqbvValidator.message);
                 // Timeout is set to avoid problems with the events being considered 'already fired'
                 setTimeout(function () {
                   rrjqbvThis.trigger("change.validation");
                 }, 1); // doesn't need a long timeout, just long enough for the event bubble to burst
               }
             }
           );
         }

         return false;

       }
     },
     ajax: {
       name: "ajax",
       init: function ($this, name) {
         return {
           validatorName: name,
           url: $this.data("validation" + name + "Ajax"),
           lastValue: $this.val(),
           lastValid: true,
           lastFinished: true
         };
       },
       validate: function ($this, value, validator) {
         if (""+validator.lastValue === ""+value && validator.lastFinished === true) {
           return validator.lastValid === false;
         }

         if (validator.lastFinished === true)
         {
           validator.lastValue = value;
           validator.lastValid = true;
           validator.lastFinished = false;
           $.ajax({
             url: validator.url,
             data: "value=" + value + "&field=" + $this.attr("name"),
             dataType: "json",
             success: function (data) {
               if (""+validator.lastValue === ""+data.value) {
                 validator.lastValid = !!(data.valid);
                 if (data.message) {
                   validator.message = data.message;
                 }
                 validator.lastFinished = true;
                 $this.data("validation" + validator.validatorName + "Message", validator.message);
                 // Timeout is set to avoid problems with the events being considered 'already fired'
                 setTimeout(function () {
                   $this.trigger("change.validation");
                 }, 1); // doesn't need a long timeout, just long enough for the event bubble to burst
               }
             },
             failure: function () {
               validator.lastValid = true;
               validator.message = "ajax call failed";
               validator.lastFinished = true;
               $this.data("validation" + validator.validatorName + "Message", validator.message);
               // Timeout is set to avoid problems with the events being considered 'already fired'
               setTimeout(function () {
                 $this.trigger("change.validation");
               }, 1); // doesn't need a long timeout, just long enough for the event bubble to burst
             }
           });
         }

         return false;

       }
     },
            regex: {
                name: "regex",
                init: function ($this, name) {
                    return {regex: regexFromString($this.data("validation" + name + "Regex"))};
                },
                validate: function ($this, value, validator) {
                    return (!validator.regex.test(value) && ! validator.negative)
                        || (validator.regex.test(value) && validator.negative);
                }
            },
            required: {
                name: "required",
                init: function ($this, name) {
                    return {};
                },
                validate: function ($this, value, validator) {
                    return !!(value.length === 0  && ! validator.negative)
                        || !!(value.length > 0 && validator.negative);
                },
       blockSubmit: true
            },
            match: {
                name: "match",
                init: function ($this, name) {
                    var element = $this.parents("form").first().find("[name=\"" + $this.data("validation" + name + "Match") + "\"]").first();
                    element.bind("validation.validation", function () {
                        $this.trigger("change.validation", {submitting: true});
                    });
                    return {"element": element};
                },
                validate: function ($this, value, validator) {
                    return (value !== validator.element.val() && ! validator.negative)
                        || (value === validator.element.val() && validator.negative);
                },
       blockSubmit: true
            },
            max: {
                name: "max",
                init: function ($this, name) {
                    return {max: $this.data("validation" + name + "Max")};
                },
                validate: function ($this, value, validator) {
                    return (parseFloat(value, 10) > parseFloat(validator.max, 10) && ! validator.negative)
                        || (parseFloat(value, 10) <= parseFloat(validator.max, 10) && validator.negative);
                }
            },
            min: {
                name: "min",
                init: function ($this, name) {
                    return {min: $this.data("validation" + name + "Min")};
                },
                validate: function ($this, value, validator) {
                    return (parseFloat(value) < parseFloat(validator.min) && ! validator.negative)
                        || (parseFloat(value) >= parseFloat(validator.min) && validator.negative);
                }
            },
            maxlength: {
                name: "maxlength",
                init: function ($this, name) {
                    return {maxlength: $this.data("validation" + name + "Maxlength")};
                },
                validate: function ($this, value, validator) {
                    return ((value.length > validator.maxlength) && ! validator.negative)
                        || ((value.length <= validator.maxlength) && validator.negative);
                }
            },
            minlength: {
                name: "minlength",
                init: function ($this, name) {
                    return {minlength: $this.data("validation" + name + "Minlength")};
                },
                validate: function ($this, value, validator) {
                    return ((value.length < validator.minlength) && ! validator.negative)
                        || ((value.length >= validator.minlength) && validator.negative);
                }
            },
            maxchecked: {
                name: "maxchecked",
                init: function ($this, name) {
                    var elements = $this.parents("form").first().find("[name=\"" + $this.attr("name") + "\"]");
                    elements.bind("click.validation", function () {
                        $this.trigger("change.validation", {includeEmpty: true});
                    });
                    return {maxchecked: $this.data("validation" + name + "Maxchecked"), elements: elements};
                },
                validate: function ($this, value, validator) {
                    return (validator.elements.filter(":checked").length > validator.maxchecked && ! validator.negative)
                        || (validator.elements.filter(":checked").length <= validator.maxchecked && validator.negative);
                },
       blockSubmit: true
            },
            minchecked: {
                name: "minchecked",
                init: function ($this, name) {
                    var elements = $this.parents("form").first().find("[name=\"" + $this.attr("name") + "\"]");
                    elements.bind("click.validation", function () {
                        $this.trigger("change.validation", {includeEmpty: true});
                    });
                    return {minchecked: $this.data("validation" + name + "Minchecked"), elements: elements};
                },
                validate: function ($this, value, validator) {
                    return (validator.elements.filter(":checked").length < validator.minchecked && ! validator.negative)
                        || (validator.elements.filter(":checked").length >= validator.minchecked && validator.negative);
                },
       blockSubmit: true
            }
        },
        builtInValidators: {
            email: {
                name: "Email",
                type: "shortcut",
                shortcut: "validemail"
            },
            validemail: {
                name: "Validemail",
                type: "regex",
                regex: "[A-Za-z0-9._%+-]+@[A-Za-z0-9.-]+\\\.[A-Za-z]{2,4}",
                message: "Keine gültige Email Adresse<!-- data-validator-validemail-message to override -->"
            },
            passwordagain: {
                name: "Passwordagain",
                type: "match",
                match: "password",
                message: "Does not match the given password<!-- data-validator-paswordagain-message to override -->"
            },
            positive: {
                name: "Positive",
                type: "shortcut",
                shortcut: "number,positivenumber"
            },
            negative: {
                name: "Negative",
                type: "shortcut",
                shortcut: "number,negativenumber"
            },
            number: {
                name: "Number",
                type: "regex",
                regex: "([+-]?\\\d+(\\\.\\\d*)?([eE][+-]?[0-9]+)?)?",
                message: "Must be a number<!-- data-validator-number-message to override -->"
            },
            integer: {
                name: "Integer",
                type: "regex",
                regex: "[+-]?\\\d+",
                message: "No decimal places allowed<!-- data-validator-integer-message to override -->"
            },
            positivenumber: {
                name: "Positivenumber",
                type: "min",
                min: 0,
                message: "Must be a positive number<!-- data-validator-positivenumber-message to override -->"
            },
            negativenumber: {
                name: "Negativenumber",
                type: "max",
                max: 0,
                message: "Must be a negative number<!-- data-validator-negativenumber-message to override -->"
            },
            required: {
                name: "Required",
                type: "required",
                message: "This is required<!-- data-validator-required-message to override -->"
            },
            checkone: {
                name: "Checkone",
                type: "minchecked",
                minchecked: 1,
                message: "Check at least one option<!-- data-validation-checkone-message to override -->"
            }
        }
    };

    var formatValidatorName = function (name) {
        return name
            .toLowerCase()
            .replace(
                /(^|\s)([a-z])/g ,
                function(m,p1,p2) {
                    return p1+p2.toUpperCase();
                }
            )
        ;
    };

    var getValue = function ($this) {
        // Extract the value we're talking about
        var value = $this.val();
        var type = $this.attr("type");
        if (type === "checkbox") {
            value = ($this.is(":checked") ? value : "");
        }
        if (type === "radio") {
            value = ($('input[name="' + $this.attr("name") + '"]:checked').length > 0 ? value : "");
        }
        return value;
    };

 function regexFromString(inputstring) {
        return new RegExp("^" + inputstring + "$");
    }

 /**
  * Thanks to Jason Bunting via StackOverflow.com
  *
  * http://stackoverflow.com/questions/359788/how-to-execute-a-javascript-function-when-i-have-its-name-as-a-string#answer-359910
  * Short link: http://tinyurl.com/executeFunctionByName
 **/
 function executeFunctionByName(functionName, context /*, args*/) {
   var args = Array.prototype.slice.call(arguments).splice(2);
   var namespaces = functionName.split(".");
   var func = namespaces.pop();
   for(var i = 0; i < namespaces.length; i++) {
     context = context[namespaces[i]];
   }
   return context[func].apply(this, args);
 }

    $.fn.jqBootstrapValidation = function( method ) {

        if ( defaults.methods[method] ) {
            return defaults.methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
        } else if ( typeof method === 'object' || ! method ) {
            return defaults.methods.init.apply( this, arguments );
        } else {
        $.error( 'Method ' +  method + ' does not exist on jQuery.jqBootstrapValidation' );
            return null;
        }

    };

 $.jqBootstrapValidation = function (options) {
   $(":input").not("[type=image],[type=submit]").jqBootstrapValidation.apply(this,arguments);
 };

})( jQuery );

Code:
// Contact Form Scripts

$(function() {

   $("#contactForm input,#contactForm textarea").jqBootstrapValidation({
       preventSubmit: true,
       submitError: function($form, event, errors) {
           // additional error messages or events
       },
       submitSuccess: function($form, event) {
           event.preventDefault(); // prevent default submit behaviour
           // get values from FORM
           var name = $("input#name").val();
           var email = $("input#email").val();
           var phone = $("input#phone").val();
           var message = $("textarea#message").val();
           var firstName = name; // For Success/Failure Message
           // Check for white space in name for Success/Fail message
           if (firstName.indexOf(' ') >= 0) {
               firstName = name.split(' ').slice(0, -1).join(' ');
           }
           $.ajax({
               url: "././mail/contact_me.php",
               type: "POST",
               data: {
                   name: name,
                   phone: phone,
                   email: email,
                   message: message
               },
               cache: false,
               success: function() {
                   // Success message
                   $('#success').html("<div class='alert alert-success'>");
                   $('#success > .alert-success').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;")
                       .append("</button>");
                   $('#success > .alert-success')
                       .append("<strong>Ihre Nachricht wurde übermittelt </strong>");
                   $('#success > .alert-success')
                       .append('</div>');

                   //clear all fields
                   $('#contactForm').trigger("reset");
               },
               error: function() {
                   // Fail message
                   $('#success').html("<div class='alert alert-danger'>");
                   $('#success > .alert-danger').html("<button type='button' class='close' data-dismiss='alert' aria-hidden='true'>&times;")
                       .append("</button>");
                   $('#success > .alert-danger').append($("<strong>").text("Sorry " + firstName + "Es scheint, dass der E-Mail-Server nicht reagiert. Bitte versuchen Sie es später!"));
                   $('#success > .alert-danger').append('</div>');
                   //clear all fields
                   $('#contactForm').trigger("reset");
               },
           });
       },
       filter: function() {
           return $(this).is(":visible");
       },
   });

   $("a[data-toggle=\"tab\"]").click(function(e) {
       e.preventDefault();
       $(this).tab("show");
   });
});


/*When clicking on Full hide fail/success boxes */
$('#name').focus(function() {
   $('#success').html('');
});

Drucke diesen Beitrag

  Bootstrap 4 Beta veröffenlicht!
Geschrieben von: The-Error - 13.08.2017, 14:14 - Forum: Bootstrap 4 - Keine Antworten

Nach zwei Jahren Entwicklungszeit nun endlich die erste Beta-Version von Bootstrap 4.

  • Von Less nach Sass verschoben Bootstrap kompiliert nun schneller als je zuvor dank Libsass
  • Flexbox und ein verbessertes Rastersystem.
  • Gedroppte Brunnen, Thumbnails und [b]panels für cards.[/b]
  • Forced Normalize.css und konsolidiert alle unsere HTML-Reset in ein neues CSS-Modul, Reboot.
  • Brandneue Anpassungsmöglichkeiten. Anstatt Stilverzierungen wie Steigungen, Übergänge, Schatten, Rasterklassen und mehr zu einem separaten Stylesheet wie v3 zu verweisen, haben wir alle diese Optionen in Sass-Variablen verschoben. Möchten Standard-Übergänge auf alles oder um abgerundete Ecken zu deaktivieren? Einfach eine Variable aktualisieren und neu kompilieren.
  • Dropped IE8 und IE9 Unterstützung, ließ ältere Browser Versionen, und zog zu Rem-Einheiten für Komponenten-Größe , um die Vorteile der neueren CSS-Unterstützung zu nutzen. Abgesehen von unserem Raster wurden Pixel für rems und ems ausgetauscht, um die reaktionsfähige Typografie und Komponentengrößen noch einfacher zu machen. Benötige Unterstützung für IE8 / IE9, Safari 8-, iOS 8-, etc? Halten Sie mit Bootstrap 3.
  • Umschrieben alle unsere JavaScript-Plugins. Jedes Plugin wurde in ES6 umgeschrieben, um die neuesten JavaScript-Erweiterungen mit neuen Teardown-Methoden, Optionstypprüfung, neuen Methoden und vieles mehr zu nutzen.
  • Verbesserte Auto-Platzierung von Tooltips, Popovers und Dropdowns dank der Hilfe einer Bibliothek namens Popper.js .
  • Neu gestaltete und verbesserte Dokumentation. Wir haben es neu gestaltet, alles in Markdown umgeschrieben und ein paar praktische Plugins hinzugefügt, um Beispiele und Code-Snippets zu rationalisieren, um die Arbeit mit unseren Dokumenten einfacher zu machen. Wir haben auch ein erstaunliches neues Suchformular hinzugefügt!
  • Neue Build-Tools komplett in npm Scripts statt Grunt umgeschrieben, immens vereinfacht den Prozess der Entwicklung und Beitrag zu Bootstrap.
  • Und so viel mehr! Benutzerdefinierte Formularsteuerelemente, ein neu gestaltetes Karussell, eine überholte Navigationsleiste, HTML5-Formular-Validierungsstile, Hunderte von ansprechenden Utility-Klassen, neue Komponenten und mehr wurden ebenfalls aufgenommen.
Quelle: https://blog.getbootstrap.com/2017/08/10...ap-4-beta/

Drucke diesen Beitrag

  Bootsnipp Slider
Geschrieben von: Sven72 - 21.07.2017, 12:24 - Forum: Bootstrap 3 - Antworten (1)

Hallo,

ich möchte gerne dieses Snippet: https://bootsnipp.com/snippets/pjqra bei meiner Bootstrap Seite (Version 3.3.7) einbinden. Was mir nicht gelingt ist das js einzubinden.

Ich habe eine neue Datei mit dem Namen test.js angelegt.
In die Datei habe ich diesen Code eingefügt

Code:
/*Bootstrap Carousel Touch Slider.

http://bootstrapthemes.co

Credits: Bootstrap, jQuery, TouchSwipe, Animate.css, FontAwesome

*/


(function(a){if(typeof define==="function"&&define.amd&&define.amd.jQuery){define(["jquery"],a)}else{if(typeof module!=="undefined"&&module.exports){a(require("jquery"))}else{a(jQuery)}}}(function(f){var y="1.6.15",p="left",o="right",e="up",x="down",c="in",A="out",m="none",s="auto",l="swipe",t="pinch",B="tap",j="doubletap",b="longtap",z="hold",E="horizontal",u="vertical",i="all",r=10,g="start",k="move",h="end",q="cancel",a="ontouchstart" in window,v=window.navigator.msPointerEnabled&&!window.navigator.pointerEnabled&&!a,d=(window.navigator.pointerEnabled||window.navigator.msPointerEnabled)&&!a,C="TouchSwipe";var n={fingers:1,threshold:75,cancelThreshold:null,pinchThreshold:20,maxTimeThreshold:null,fingerReleaseThreshold:250,longTapThreshold:500,doubleTapThreshold:200,swipe:null,swipeLeft:null,swipeRight:null,swipeUp:null,swipeDown:null,swipeStatus:null,pinchIn:null,pinchOut:null,pinchStatus:null,click:null,tap:null,doubleTap:null,longTap:null,hold:null,triggerOnTouchEnd:true,triggerOnTouchLeave:false,allowPageScroll:"auto",fallbackToMouseEvents:true,excludedElements:"label, button, input, select, textarea, a, .noSwipe",preventDefaultEvents:true};f.fn.swipe=function(H){var G=f(this),F=G.data(C);if(F&&typeof H==="string"){if(F[H]){return F[H].apply(this,Array.prototype.slice.call(arguments,1))}else{f.error("Method "+H+" does not exist on jQuery.swipe")}}else{if(F&&typeof H==="object"){F.option.apply(this,arguments)}else{if(!F&&(typeof H==="object"||!H)){return w.apply(this,arguments)}}}return G};f.fn.swipe.version=y;f.fn.swipe.defaults=n;f.fn.swipe.phases={PHASE_START:g,PHASE_MOVE:k,PHASE_END:h,PHASE_CANCEL:q};f.fn.swipe.directions={LEFT:p,RIGHT:o,UP:e,DOWN:x,IN:c,OUT:A};f.fn.swipe.pageScroll={NONE:m,HORIZONTAL:E,VERTICAL:u,AUTO:s};f.fn.swipe.fingers={ONE:1,TWO:2,THREE:3,FOUR:4,FIVE:5,ALL:i};function w(F){if(F&&(F.allowPageScroll===undefined&&(F.swipe!==undefined||F.swipeStatus!==undefined))){F.allowPageScroll=m}if(F.click!==undefined&&F.tap===undefined){F.tap=F.click}if(!F){F={}}F=f.extend({},f.fn.swipe.defaults,F);return this.each(function(){var H=f(this);var G=H.data(C);if(!G){G=new D(this,F);H.data(C,G)}})}function D(a5,au){var au=f.extend({},au);var az=(a||d||!au.fallbackToMouseEvents),K=az?(d?(v?"MSPointerDown":"pointerdown"):"touchstart"):"mousedown",ax=az?(d?(v?"MSPointerMove":"pointermove"):"touchmove"):"mousemove",V=az?(d?(v?"MSPointerUp":"pointerup"):"touchend"):"mouseup",T=az?(d?"mouseleave":null):"mouseleave",aD=(d?(v?"MSPointerCancel":"pointercancel"):"touchcancel");var ag=0,aP=null,a2=null,ac=0,a1=0,aZ=0,H=1,ap=0,aJ=0,N=null;var aR=f(a5);var aa="start";var X=0;var aQ={};var U=0,a3=0,a6=0,ay=0,O=0;var aW=null,af=null;try{aR.bind(K,aN);aR.bind(aD,ba)}catch(aj){f.error("events not supported "+K+","+aD+" on jQuery.swipe")}this.enable=function(){aR.bind(K,aN);aR.bind(aD,ba);return aR};this.disable=function(){aK();return aR};this.destroy=function(){aK();aR.data(C,null);aR=null};this.option=function(bd,bc){if(typeof bd==="object"){au=f.extend(au,bd)}else{if(au[bd]!==undefined){if(bc===undefined){return au[bd]}else{au[bd]=bc}}else{if(!bd){return au}else{f.error("Option "+bd+" does not exist on jQuery.swipe.options")}}}return null};function aN(be){if(aB()){return}if(f(be.target).closest(au.excludedElements,aR).length>0){return}var bf=be.originalEvent?be.originalEvent:be;var bd,bg=bf.touches,bc=bg?bg[0]:bf;aa=g;if(bg){X=bg.length}else{if(au.preventDefaultEvents!==false){be.preventDefault()}}ag=0;aP=null;a2=null;aJ=null;ac=0;a1=0;aZ=0;H=1;ap=0;N=ab();S();ai(0,bc);if(!bg||(X===au.fingers||au.fingers===i)||aX()){U=ar();if(X==2){ai(1,bg[1]);a1=aZ=at(aQ[0].start,aQ[1].start)}if(au.swipeStatus||au.pinchStatus){bd=P(bf,aa)}}else{bd=false}if(bd===false){aa=q;P(bf,aa);return bd}else{if(au.hold){af=setTimeout(f.proxy(function(){aR.trigger("hold",[bf.target]);if(au.hold){bd=au.hold.call(aR,bf,bf.target)}},this),au.longTapThreshold)}an(true)}return null}function a4(bf){var bi=bf.originalEvent?bf.originalEvent:bf;if(aa===h||aa===q||al()){return}var be,bj=bi.touches,bd=bj?bj[0]:bi;var bg=aH(bd);a3=ar();if(bj){X=bj.length}if(au.hold){clearTimeout(af)}aa=k;if(X==2){if(a1==0){ai(1,bj[1]);a1=aZ=at(aQ[0].start,aQ[1].start)}else{aH(bj[1]);aZ=at(aQ[0].end,aQ[1].end);aJ=aq(aQ[0].end,aQ[1].end)}H=a8(a1,aZ);ap=Math.abs(a1-aZ)}if((X===au.fingers||au.fingers===i)||!bj||aX()){aP=aL(bg.start,bg.end);a2=aL(bg.last,bg.end);ak(bf,a2);ag=aS(bg.start,bg.end);ac=aM();aI(aP,ag);be=P(bi,aa);if(!au.triggerOnTouchEnd||au.triggerOnTouchLeave){var bc=true;if(au.triggerOnTouchLeave){var bh=aY(this);bc=F(bg.end,bh)}if(!au.triggerOnTouchEnd&&bc){aa=aC(k)}else{if(au.triggerOnTouchLeave&&!bc){aa=aC(h)}}if(aa==q||aa==h){P(bi,aa)}}}else{aa=q;P(bi,aa)}if(be===false){aa=q;P(bi,aa)}}function M(bc){var bd=bc.originalEvent?bc.originalEvent:bc,be=bd.touches;if(be){if(be.length&&!al()){G(bd);return true}else{if(be.length&&al()){return true}}}if(al()){X=ay}a3=ar();ac=aM();if(bb()||!am()){aa=q;P(bd,aa)}else{if(au.triggerOnTouchEnd||(au.triggerOnTouchEnd==false&&aa===k)){if(au.preventDefaultEvents!==false){bc.preventDefault()}aa=h;P(bd,aa)}else{if(!au.triggerOnTouchEnd&&a7()){aa=h;aF(bd,aa,B)}else{if(aa===k){aa=q;P(bd,aa)}}}}an(false);return null}function ba(){X=0;a3=0;U=0;a1=0;aZ=0;H=1;S();an(false)}function L(bc){var bd=bc.originalEvent?bc.originalEvent:bc;if(au.triggerOnTouchLeave){aa=aC(h);P(bd,aa)}}function aK(){aR.unbind(K,aN);aR.unbind(aD,ba);aR.unbind(ax,a4);aR.unbind(V,M);if(T){aR.unbind(T,L)}an(false)}function aC(bg){var bf=bg;var be=aA();var bd=am();var bc=bb();if(!be||bc){bf=q}else{if(bd&&bg==k&&(!au.triggerOnTouchEnd||au.triggerOnTouchLeave)){bf=h}else{if(!bd&&bg==h&&au.triggerOnTouchLeave){bf=q}}}return bf}function P(be,bc){var bd,bf=be.touches;if(J()||W()){bd=aF(be,bc,l)}if((Q()||aX())&&bd!==false){bd=aF(be,bc,t)}if(aG()&&bd!==false){bd=aF(be,bc,j)}else{if(ao()&&bd!==false){bd=aF(be,bc,b)}else{if(ah()&&bd!==false){bd=aF(be,bc,B)}}}if(bc===q){if(W()){bd=aF(be,bc,l)}if(aX()){bd=aF(be,bc,t)}ba(be)}if(bc===h){if(bf){if(!bf.length){ba(be)}}else{ba(be)}}return bd}function aF(bf,bc,be){var bd;if(be==l){aR.trigger("swipeStatus",[bc,aP||null,ag||0,ac||0,X,aQ,a2]);if(au.swipeStatus){bd=au.swipeStatus.call(aR,bf,bc,aP||null,ag||0,ac||0,X,aQ,a2);if(bd===false){return false}}if(bc==h&&aV()){clearTimeout(aW);clearTimeout(af);aR.trigger("swipe",[aP,ag,ac,X,aQ,a2]);if(au.swipe){bd=au.swipe.call(aR,bf,aP,ag,ac,X,aQ,a2);if(bd===false){return false}}switch(aP){case p:aR.trigger("swipeLeft",[aP,ag,ac,X,aQ,a2]);if(au.swipeLeft){bd=au.swipeLeft.call(aR,bf,aP,ag,ac,X,aQ,a2)}break;case o:aR.trigger("swipeRight",[aP,ag,ac,X,aQ,a2]);if(au.swipeRight){bd=au.swipeRight.call(aR,bf,aP,ag,ac,X,aQ,a2)}break;case e:aR.trigger("swipeUp",[aP,ag,ac,X,aQ,a2]);if(au.swipeUp){bd=au.swipeUp.call(aR,bf,aP,ag,ac,X,aQ,a2)}break;case x:aR.trigger("swipeDown",[aP,ag,ac,X,aQ,a2]);if(au.swipeDown){bd=au.swipeDown.call(aR,bf,aP,ag,ac,X,aQ,a2)}break}}}if(be==t){aR.trigger("pinchStatus",[bc,aJ||null,ap||0,ac||0,X,H,aQ]);if(au.pinchStatus){bd=au.pinchStatus.call(aR,bf,bc,aJ||null,ap||0,ac||0,X,H,aQ);if(bd===false){return false}}if(bc==h&&a9()){switch(aJ){case c:aR.trigger("pinchIn",[aJ||null,ap||0,ac||0,X,H,aQ]);if(au.pinchIn){bd=au.pinchIn.call(aR,bf,aJ||null,ap||0,ac||0,X,H,aQ)}break;case A:aR.trigger("pinchOut",[aJ||null,ap||0,ac||0,X,H,aQ]);if(au.pinchOut){bd=au.pinchOut.call(aR,bf,aJ||null,ap||0,ac||0,X,H,aQ)}break}}}if(be==B){if(bc===q||bc===h){clearTimeout(aW);clearTimeout(af);if(Z()&&!I()){O=ar();aW=setTimeout(f.proxy(function(){O=null;aR.trigger("tap",[bf.target]);if(au.tap){bd=au.tap.call(aR,bf,bf.target)}},this),au.doubleTapThreshold)}else{O=null;aR.trigger("tap",[bf.target]);if(au.tap){bd=au.tap.call(aR,bf,bf.target)}}}}else{if(be==j){if(bc===q||bc===h){clearTimeout(aW);clearTimeout(af);O=null;aR.trigger("doubletap",[bf.target]);if(au.doubleTap){bd=au.doubleTap.call(aR,bf,bf.target)}}}else{if(be==b){if(bc===q||bc===h){clearTimeout(aW);O=null;aR.trigger("longtap",[bf.target]);if(au.longTap){bd=au.longTap.call(aR,bf,bf.target)}}}}}return bd}function am(){var bc=true;if(au.threshold!==null){bc=ag>=au.threshold}return bc}function bb(){var bc=false;if(au.cancelThreshold!==null&&aP!==null){bc=(aT(aP)-ag)>=au.cancelThreshold}return bc}function ae(){if(au.pinchThreshold!==null){return ap>=au.pinchThreshold}return true}function aA(){var bc;if(au.maxTimeThreshold){if(ac>=au.maxTimeThreshold){bc=false}else{bc=true}}else{bc=true}return bc}function ak(bc,bd){if(au.preventDefaultEvents===false){return}if(au.allowPageScroll===m){bc.preventDefault()}else{var be=au.allowPageScroll===s;switch(bd){case p:if((au.swipeLeft&&be)||(!be&&au.allowPageScroll!=E)){bc.preventDefault()}break;case o:if((au.swipeRight&&be)||(!be&&au.allowPageScroll!=E)){bc.preventDefault()}break;case e:if((au.swipeUp&&be)||(!be&&au.allowPageScroll!=u)){bc.preventDefault()}break;case x:if((au.swipeDown&&be)||(!be&&au.allowPageScroll!=u)){bc.preventDefault()}break}}}function a9(){var bd=aO();var bc=Y();var be=ae();return bd&&bc&&be}function aX(){return !!(au.pinchStatus||au.pinchIn||au.pinchOut)}function Q(){return !!(a9()&&aX())}function aV(){var bf=aA();var bh=am();var be=aO();var bc=Y();var bd=bb();var bg=!bd&&bc&&be&&bh&&bf;return bg}function W(){return !!(au.swipe||au.swipeStatus||au.swipeLeft||au.swipeRight||au.swipeUp||au.swipeDown)}function J(){return !!(aV()&&W())}function aO(){return((X===au.fingers||au.fingers===i)||!a)}function Y(){return aQ[0].end.x!==0}function a7(){return !!(au.tap)}function Z(){return !!(au.doubleTap)}function aU(){return !!(au.longTap)}function R(){if(O==null){return false}var bc=ar();return(Z()&&((bc-O)<=au.doubleTapThreshold))}function I(){return R()}function aw(){return((X===1||!a)&&(isNaN(ag)||ag<au.threshold))}function a0(){return((ac>au.longTapThreshold)&&(ag<r))}function ah(){return !!(aw()&&a7())}function aG(){return !!(R()&&Z())}function ao(){return !!(a0()&&aU())}function G(bc){a6=ar();ay=bc.touches.length+1}function S(){a6=0;ay=0}function al(){var bc=false;if(a6){var bd=ar()-a6;if(bd<=au.fingerReleaseThreshold){bc=true}}return bc}function aB(){return !!(aR.data(C+"_intouch")===true)}function an(bc){if(!aR){return}if(bc===true){aR.bind(ax,a4);aR.bind(V,M);if(T){aR.bind(T,L)}}else{aR.unbind(ax,a4,false);aR.unbind(V,M,false);if(T){aR.unbind(T,L,false)}}aR.data(C+"_intouch",bc===true)}function ai(be,bc){var bd={start:{x:0,y:0},last:{x:0,y:0},end:{x:0,y:0}};bd.start.x=bd.last.x=bd.end.x=bc.pageX||bc.clientX;bd.start.y=bd.last.y=bd.end.y=bc.pageY||bc.clientY;aQ[be]=bd;return bd}function aH(bc){var be=bc.identifier!==undefined?bc.identifier:0;var bd=ad(be);if(bd===null){bd=ai(be,bc)}bd.last.x=bd.end.x;bd.last.y=bd.end.y;bd.end.x=bc.pageX||bc.clientX;bd.end.y=bc.pageY||bc.clientY;return bd}function ad(bc){return aQ[bc]||null}function aI(bc,bd){bd=Math.max(bd,aT(bc));N[bc].distance=bd}function aT(bc){if(N[bc]){return N[bc].distance}return undefined}function ab(){var bc={};bc[p]=av(p);bc[o]=av(o);bc[e]=av(e);bc[x]=av(x);return bc}function av(bc){return{direction:bc,distance:0}}function aM(){return a3-U}function at(bf,be){var bd=Math.abs(bf.x-be.x);var bc=Math.abs(bf.y-be.y);return Math.round(Math.sqrt(bd*bd+bc*bc))}function a8(bc,bd){var be=(bd/bc)*1;return be.toFixed(2)}function aq(){if(H<1){return A}else{return c}}function aS(bd,bc){return Math.round(Math.sqrt(Math.pow(bc.x-bd.x,2)+Math.pow(bc.y-bd.y,2)))}function aE(bf,bd){var bc=bf.x-bd.x;var bh=bd.y-bf.y;var be=Math.atan2(bh,bc);var bg=Math.round(be*180/Math.PI);if(bg<0){bg=360-Math.abs(bg)}return bg}function aL(bd,bc){var be=aE(bd,bc);if((be<=45)&&(be>=0)){return p}else{if((be<=360)&&(be>=315)){return p}else{if((be>=135)&&(be<=225)){return o}else{if((be>45)&&(be<135)){return x}else{return e}}}}}function ar(){var bc=new Date();return bc.getTime()}function aY(bc){bc=f(bc);var be=bc.offset();var bd={left:be.left,right:be.left+bc.outerWidth(),top:be.top,bottom:be.top+bc.outerHeight()};return bd}function F(bc,bd){return(bc.x>bd.left&&bc.x<bd.right&&bc.y>bd.top&&bc.y<bd.bottom)}}}));!function(n){"use strict";n.fn.bsTouchSlider=function(i){var a=n(".carousel");return this.each(function(){function i(i){var a="webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend";i.each(function(){var i=n(this),t=i.data("animation");i.addClass(t).one(a,function(){i.removeClass(t)})})}var t=a.find(".item:first").find("[data-animation ^= 'animated']");a.carousel(),i(t),a.on("slide.bs.carousel",function(a){var t=n(a.relatedTarget).find("[data-animation ^= 'animated']");i(t)}),n(".carousel .carousel-inner").swipe({swipeLeft:function(n,i,a,t,e){this.parent().carousel("next")},swipeRight:function(){this.parent().carousel("prev")},threshold:0})})}}(jQuery);



//Initialise Bootstrap Carousel Touch Slider
// Curently there are no option available.

$('#bootstrap-touch-slider').bsTouchSlider();


In die html-Datei habe ich das hier vor den schließenden Body Tag eingefügt
Code:
<script src="js/test.js"></script>


Meine Ordnerstruktur sieht so aus:
Ordner: bootstrapp
darin enthalten Ordner: js + css + fonts
+ index.html

Ordner sind in der Anlage

Die Animation geht bei mir nicht. Hat jemand eine Idee was ich falsch mache.
Danke und Grüße



Angehängte Dateien
.zip   bootstrap-3.3.7-dist-vorlage.zip (Größe: 509,55 KB / Downloads: 1)
Drucke diesen Beitrag

  Mehrsprachiges Menü
Geschrieben von: The-Error - 18.07.2017, 11:37 - Forum: Hilfe - Häufig gestellte Fragen - Keine Antworten

Hier ein Beispiel für ein multilanguage Menu mit Animatin (animate.css):

[Bild: multimenu.jpg]



Angehängte Dateien
.rar   muli-lang-menu.rar (Größe: 18,52 KB / Downloads: 1)
Drucke diesen Beitrag

  Panel mit Navigation
Geschrieben von: The-Error - 06.07.2017, 11:15 - Forum: Hilfe - Häufig gestellte Fragen - Keine Antworten

Panel mit Navigation und Content!

So sieht es aus!

Code:
<!DOCTYPE html>
<html lang="de">

<head>
   <meta charset="utf-8">
   <title>Bootstrap Lightbox</title>
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <!-- Das neueste kompilierte und minimierte CSS -->
   <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
   <style type="text/css">
       .panel {
           border-radius: 0;
           border-color: #000;
           border-width: 3px;
       }
       
       .panel-heading {
           background-color: #337ab7;
           border-radius: 0;
       }
       
       .navi-panael {
           background-color: #2DC300
       }
       
       .nav-pills>li>a {
           border-radius: 0;
           color: #000;
       }
       
       .nav-pills>li>a:hover {
           color: #000;
       }
       
       .nav>li>a:focus,
       .nav>li>a:hover,
       {
           text-decoration: none;
           background-color: #8A8A8A;
       }
       
       .nav-pills>li.active>a,
       .nav-pills>li.active>a:focus,
       .nav-pills>li.active>a:hover {
           color: #fff;
           background-color: #8A8A8A;
       }
       
       .tab-content {
           background-color: #FFFBFB;
           padding: 15px;
       }

   </style>

   <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script>
   <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
</head>

<body>
   <div class="container">
       <div class="panel ">
           <!-- Standard-Panel-Inhalt -->
           <div class="panel-heading ">
               <h2>Panel-Überschrift</h2>
           </div>





           <div class="navi-panael">
               <ul class="nav nav-pills ">
                   <li class="active">
                       <a href="#start" data-toggle="tab">Start</a>
                   </li>
                   <li><a href="#profil" data-toggle="tab">Profil</a>
                   </li>
                   <li><a href="#kontakt" data-toggle="tab">Kontakt</a>
                   </li>
                   <li><a href="#info" data-toggle="tab">Info</a>
                   </li>
               </ul>
           </div>
           <div class="tab-content clearfix">
               <div class="tab-pane active" id="start">
                   <h3>Start</h3>
                   <p>Auch gibt es niemanden, der den Schmerz an sich liebt, sucht oder wünscht, nur, weil er Schmerz ist, es sei denn, es kommt zu zufälligen Umständen, in denen Mühen und Schmerz ihm große Freude bereiten können.</p>

                   <p>Um ein triviales Beispiel zu nehmen, wer von uns unterzieht sich je anstrengender körperlicher Betätigung, außer um Vorteile daraus zu ziehen? Aber wer hat irgend ein Recht, einen Menschen zu tadeln, der die Entscheidung trifft, eine Freude zu genießen, die keine unangenehmen Folgen hat, oder einen, der Schmerz vermeidet, welcher keine daraus resultierende Freude nach sich zieht? Auch gibt es niemanden, der den Schmerz</p>
               </div>

               <div class="tab-pane" id="profil">
                   <h3>Profil</h3>
                   <p>Weit hinten, hinter den Wortbergen, fern der Länder Vokalien und Konsonantien leben die Blindtexte. Abgeschieden wohnen sie in Buchstabhausen an der Küste des Semantik, eines großen Sprachozeans.</p>

                   <p>Ein kleines Bächlein namens Duden fließt durch ihren Ort und versorgt sie mit den nötigen Regelialien. Es ist ein paradiesmatisches Land, in dem einem gebratene Satzteile in den Mund fliegen.</p>

                   <p>Nicht einmal von der allmächtigen Interpunktion werden die Blindtexte beherrscht – ein geradezu unorthographisches Leben. Eines Tages aber beschloß eine kleine Zeile Blindtext, ihr Name war Lorem Ipsum, hinaus zu gehen in die weite Grammatik. Der große Oxmox riet ihr davon ab, da</p>
               </div>
               <div class="tab-pane" id="kontakt">
                   <h3>Kontakt</h3>
                   <p>Weit hinten, hinter den Wortbergen, fern der Länder Vokalien und Konsonantien leben die Blindtexte. Abgeschieden wohnen sie in Buchstabhausen an der Küste des Semantik, eines großen Sprachozeans.</p>

                   <p>Ein kleines Bächlein namens Duden fließt durch ihren Ort und versorgt sie mit den nötigen Regelialien. Es ist ein paradiesmatisches Land, in dem einem gebratene Satzteile in den Mund fliegen.</p>
               </div>
               <div class="tab-pane" id="info">
                   <h3>Info</h3>
                   <p>Jemand musste Josef K. verleumdet haben, denn ohne dass er etwas Böses getan hätte, wurde er eines Morgens verhaftet. »Wie ein Hund!</p>

                   <p>« sagte er, es war, als sollte die Scham ihn überleben. Als Gregor Samsa eines Morgens aus unruhigen Träumen erwachte, fand er sich in seinem Bett zu einem ungeheueren Ungeziefer verwandelt.</p>
               </div>
           </div>
       </div>
   </div>




</body>

</html>

Drucke diesen Beitrag

  Grid-System (Raster) in Bootstrap 4 ändern
Geschrieben von: The-Error - 28.06.2017, 11:41 - Forum: Bootstrap 4 - Keine Antworten

In Bootstrap 4 ist es möglich ein benutzerdefiniertes Raster zu erzeugen.

Benötigt wird ein Sass-Kompilier wie Koala
Die Bootstrap Source files

In den Verzeichnis scss befindet sich die Datei "_custom.scss"

Diese wir wie folgt bearbeitet:

Code:
// Bootstrap overrides
//
// Copy variables from `_variables.scss` to this file to override default values
// without modifying source files.
$grid-columns:               16;

durch  $grid-columns: 16; wird das Raster auf 16 gesetzt.

Danach wird mit Koala die bootstrap.css neu kompiliert.
Nun sollte das Bootstrip Gridsystem aus 16 Spalten bestehen.



Video zum Umgang mit Sass und Koala:




Im Anhang ein Beispiel mit 16 Spalten Rastersystem



Angehängte Dateien
.rar   bootstrap-4.0.0.rar (Größe: 213,09 KB / Downloads: 0)
Drucke diesen Beitrag

  Collapsed Navbar schließt sich in Safari sofort nach dem öffnen
Geschrieben von: Post1982 - 21.06.2017, 11:15 - Forum: Bootstrap 3 - Antworten (1)

Hallo zusammen,

wenn ich meine Seite über den Safari auf dem IPhone öffne, dann schließt sich die Navbar sofort nach dem anklicken wieder und bleibt nicht offen.

Hat jemand eine Idee, wie ich dieses Verhalten ändern kann?

Vielen Dank im Voraus

MfG

Drucke diesen Beitrag

  Favicon für Bootstrap-Forum
Geschrieben von: Idna - 19.06.2017, 13:27 - Forum: Smalltalk - Antworten (1)

Ich finde dass ein Favicon für das Bootstrap-Forum nicht schlecht wäre dann kann ich die Seite in meine Lesezeichenleiste schmeissen und hat ein Farbiges Symbol.
Wink

Drucke diesen Beitrag

  Bootstrap 3 für Anfänger
Geschrieben von: Idna - 13.06.2017, 12:03 - Forum: Bootstrap 4 - Antworten (1)

Lohnt sich eigentlich noch Bootstrap 3 für Anfänger oder sollte schon die Version 4 genutzt werden?

Was meint ihr dazu?

Drucke diesen Beitrag