Hallo,
ich habe folgendes Problem.
Ich möchte ein jquery slider-tool verwenden.
Dieses hatte ich zuvor in einer normalen html-seite ausprobiert und es hat funktioniert.
Wenn ich es in meine php-Seite einbinde geht es nicht mehr.
Nun habe ich es nach dem login ganz oben also noch vor dem Html-Header eingebunden und da geht es
hier die index.php (die kommt nach der login.php
## da oben schon der Slider eingebunden wurde, wird er auch sauber angezeigt und funktioniert
Normal sollte er jedoch in dieser Seite eingebunden werden, dort funktioniert er nicht
hier also der Kopfbereich der phEc.php
diese besteht jedoch nur aus html-code
der ein css-framework von Kickstart nutzt
u.a. so
//die header.php sieht so aus // bitte nicht wundern... ich probier gerade einiges aus...
das script sbmanager.js hat diesen code für den slider
wieso der slider vor der Navigationsleiste sauber angezeigt wird und danach nicht mehr... ???
sieht jemand den Fehler den ich machte?
Grüße Jürgen
Info:
ich hatte gerade nochmals meine slidertest.html angesehen
da geht es jea...
mir ist jedoch aufegafllen das dort die <script> Anweisung nach dem html-code kommt
ich hatte das gerade ausprobiert die script-Anweisung davor zu setzen... dann ging es dort auch nicht
wieso?
hier der Code der testseite
ich habe folgendes Problem.
Ich möchte ein jquery slider-tool verwenden.
Dieses hatte ich zuvor in einer normalen html-seite ausprobiert und es hat funktioniert.
Wenn ich es in meine php-Seite einbinde geht es nicht mehr.
Nun habe ich es nach dem login ganz oben also noch vor dem Html-Header eingebunden und da geht es
hier die index.php (die kommt nach der login.php
PHP-Code:
<?php
if (htmlspecialchars($_GET["id"] == "")){
error_reporting(-1);
include("incl/header.php");
ini_set('display_errors', true);
include ("incl/auth.php");
clearstatcache();
include 'incl/locale.php';
include("incl/nav.php");
}elseif (htmlspecialchars($_GET["id"] =="1")){
// hier kommte der jquery slider
echo '<div class="layout-slider" ><input id="slideHours" type="slider" name="area" value="0;60" /></div>' . PHP_EOL;
echo '<div class="layout-slider" ><input id="slideDays" type="slider" name="area" value="0;0" /></div>' . PHP_EOL;
include("pages/phEc.php"); //pages/phEc.php
}
include("incl/footer.php");
$seite = $_SERVER["REQUEST_URI"];
?>
Normal sollte er jedoch in dieser Seite eingebunden werden, dort funktioniert er nicht
hier also der Kopfbereich der phEc.php
PHP-Code:
<?php
error_reporting(-1);
ini_set('display_errors', true);
include("incl/header.php");
include ("incl/auth.php");
include 'incl/locale.php';
include("db/dbconnect.php");
include("incl/nav.php");
.
. // hier kommen entliche Datenbankabfragen etc.. jedoch kein html-code
.
.
//dann kommt sofort dieser code und dies geht schon nicht mehr
echo '<div class="layout-slider" ><input id="slideHours" type="slider" name="area" value="0;60" /></div>' . PHP_EOL;
echo '<div class="layout-slider" ><input id="slideDays" type="slider" name="area" value="0;0" /></div>' . PHP_EOL;
//
// alles was an html noch dazwischen geladen wird (siehe oben die includes ist die incl/nav.php
der ein css-framework von Kickstart nutzt
u.a. so
Code:
<ul class="menu"> <li class="current"><a href="/index.php"><i class="icon-home"></i><?=_('Home')?></a></li> . . . etc // hier wird kein header und nichts geladen
//die header.php sieht so aus // bitte nicht wundern... ich probier gerade einiges aus...
Code:
<!doctype html> <html> <head> <meta http-equiv="Content-Style-Type" content="text/css"> <meta charset="utf-8"> <title><?=_('')?></title> <link rel="stylesheet" type="text/css" href="css/kickstart.css" media="all" /> <!-- KICKSTART --> <link rel="stylesheet" type="text/css" href="css/style.css" media="all" /> <link rel="stylesheet" href="css/jslider.css" type="text/css"> <link rel="stylesheet" href="css/jslider.plastic.css" type="text/css"> <script type="text/javascript" src="js/jquery-1.7.1.js"></script> <script type="text/javascript" src="/javascript/tcal.js"></script> <!--<script src="js/jquery-2.1.3.js"></script>--> <script type="text/javascript" src="js/jshashtable-2.1_src.js"></script> <script type="text/javascript" src="js/jquery.numberformatter-1.2.3.js"></script> <script type="text/javascript" src="js/tmpl.js"></script> <script type="text/javascript" src="js/jquery.dependClass-0.1.js"></script> <script type="text/javascript" src="js/draggable-0.1.js"></script> <script type="text/javascript" src="js/jquery.slider.js"></script> <script src="js/kickstart.js"></script> <!-- KICKSTART --> <script src="js/sbmanager.js"></script> <style type="text/css" media="screen"> .layout-slider { margin-bottom: 60px; width: 50%; } .layout-slider-settings { font-size: 12px; padding-bottom: 10px; } .layout-slider-settings pre { font-family: Courier; } </style> </head> <body class="elements">
Code:
jQuery("#slideDays").slider({ from: 0, to: 7, //heterogeneity: ['50/5', '75/15'], scale: [0, 1, 2, 3, 4, 5, 6, 7], limits: false, step: 1, dimension: ' Days', skin: "plastic", callback: function( value ){ console.dir( this ); } }); jQuery("#slideHours").slider({ from: 0, to: 1440, step: 30, dimension: ' Uhr', skin: "plastic", scale: ['0:00','|','|','3:00','|','|','6:00','|','|','9:00','|','|', '12:00','|','|', '15:00','|','|','18:00','|','|','21:00','|','|', '24:00'], limits: false, calculate: function( value ){ var hours = Math.floor( value / 60 ); var mins = ( value - hours*60 ); return (hours < 10 ? "0"+hours : hours) + ":" + ( mins == 0 ? "00" : mins ); }});
sieht jemand den Fehler den ich machte?
Grüße Jürgen
Info:
ich hatte gerade nochmals meine slidertest.html angesehen
da geht es jea...
mir ist jedoch aufegafllen das dort die <script> Anweisung nach dem html-code kommt
ich hatte das gerade ausprobiert die script-Anweisung davor zu setzen... dann ging es dort auch nicht
wieso?
hier der Code der testseite
Code:
<?php $str_charset = 'utf-8'; header('Content-type: text/html; charset='.$str_charset); ?> <!doctype html> <html> <head> <meta http-equiv="Content-Style-Type" content="text/css"> <meta charset="utf-8"> <title><?=_('SB GrowManager Full-Automatic Grow Vollautmatischer Grow')?></title> <link rel="stylesheet" type="text/css" href="css/kickstart.css" media="all" /><!-- KICKSTART --> <link rel="stylesheet" type="text/css" href="css/style.css" media="all" /> <link rel="stylesheet" href="css/jslider.css" type="text/css"> <link rel="stylesheet" href="css/jslider.plastic.css" type="text/css"> <script type="text/javascript" src="js/jquery-1.7.1.js"></script> <script type="text/javascript" src="/javascript/tcal.js"></script> <!--<script src="js/jquery-2.1.3.js"></script>--> <script type="text/javascript" src="js/jshashtable-2.1_src.js"></script> <script type="text/javascript" src="js/jquery.numberformatter-1.2.3.js"></script> <script type="text/javascript" src="js/tmpl.js"></script> <script type="text/javascript" src="js/jquery.dependClass-0.1.js"></script> <script type="text/javascript" src="js/draggable-0.1.js"></script> <script type="text/javascript" src="js/jquery.slider.js"></script> <script src="js/kickstart.js"></script> <!-- KICKSTART --> <script src="js/sbgrowmanager.js"></script> <style type="text/css" media="screen"> .layout-slider { margin-bottom: 60px; width: 50%; } .layout-slider-settings { font-size: 12px; padding-bottom: 10px; } .layout-slider-settings pre { font-family: Courier; } </style> </head> <body class="elements"> <div class="layout-slider" style="width:300px"> <input id="slideHour" type="slider" name="area" value="0;60" /> </div> <div class="layout-slider" style="width:300px"> <input id="slideDay" type="slider" name="area" value="0;0" /> </div> <script type="text/javascript" charset="utf-8"> jQuery("#slideDay").slider({ from: 0, to: 7, //heterogeneity: ['50/5', '75/15'], scale: [0, 1, 2, 3, 4, 5, 6, 7], limits: false, step: 1, dimension: ' Days', skin: "plastic", callback: function( value ){ console.dir( this ); } }); jQuery("#slideHour").slider({ from: 0, to: 1440, step: 30, dimension: ' Uhr', skin: "plastic", scale: ['0:00','|','|','3:00','|','|','6:00','|','|','9:00','|','|', '12:00','|','|', '15:00','|','|','18:00','|','|','21:00','|','|', '24:00'], limits: false, calculate: function( value ){ var hours = Math.floor( value / 60 ); var mins = ( value - hours*60 ); return (hours < 10 ? "0"+hours : hours) + ":" + ( mins == 0 ? "00" : mins ); }}); </script> </body> </html>
Kommentar