{"id":221,"date":"2013-09-04T22:24:57","date_gmt":"2013-09-04T20:24:57","guid":{"rendered":"http:\/\/onbusys.de\/wp101\/?page_id=221"},"modified":"2015-06-27T13:25:36","modified_gmt":"2015-06-27T11:25:36","slug":"scroll-uebersicht-zwei-spalten-variante-1","status":"publish","type":"page","link":"https:\/\/onbusys.de\/wp101\/scroll-uebersicht-vorlage\/scroll-uebersicht-zwei-spalten-variante-1\/","title":{"rendered":"Scroll-\u00dcbersicht &#8211; zwei Spalten &#8211; Variante 1"},"content":{"rendered":"<p>\n\t<script type=\"text\/javascript\" src=\"https:\/\/onbusys.de\/101\/OBS\/obs_lib.js\"><\/script><script type=\"text\/javascript\">\nvar belbuchkal = new belbuchkal(250,0,556,\"background-color:#ffffff;border:0px solid #909090\",true);\nbelbuchkal.erstelle();\naddLoadEvent(function(){abs_freeOnTop(\"235px\",\"main\",\"primary\",\"secondary\",\"\");});\nvar multibeldiv1 = new abs_multibeldiv(\"onbusys.de\/101\",\"\",6,2,860,\"left:40px\",\"top:10px\",\"de-DE\");\nmultibeldiv1.erstelle();<\/script>\n<\/p>\n<p>\n\t<strong>Scroll-Multi-&Uuml;bersicht als erstes Element des Content-Bereichs<\/strong>\n<\/p>\n<p>\n\t<strong>Bei diesem 2-Spalten-Layout passt die Scroll-Belegungs&uuml;bersicht in keine der beiden Spalten. Deshalb muss die Scroll-Belegungs&uuml;bersicht absolut positioniert eingebunden und mit der Funktion &#39;abs_freeOnTop()&#39; Freiraum &uuml;ber den sonst verdeckten Elementen geschaffen werden. Drei Elemente sind sichtbar, die restlichen k&ouml;nnen per Scrollbar erreicht werden. Die Objekte der Scroll- Belegungs&uuml;bersicht haben einen Link zum &Ouml;ffnen des Buchungsformulars auf der gleichen Seite.<br \/>\n\tDer zugeh&ouml;rige HTML-Code wird am Ende der Seite angezeigt.<\/strong>\n<\/p>\n<hr style=\"color:#cccccc; width:100%; margin:4px 0px 14px 0px;\" \/>\n<p id=\"objekt-1\">\n\t<strong>Objekt Fewo Berg, Strandweg 4, 12345 Urlaubsort<\/strong>\n<\/p>\n<p>\n\t<img decoding=\"async\" loading=\"lazy\" alt=\"\" height=\"150\" src=\"https:\/\/onbusys.de\/101\/OBS\/Demos\/AppHaus.jpg\" style=\"float:right;margin-left:5px; margin-bottom:3px;\" width=\"200\" \/>\n<\/p>\n<p>\n\tIn diesem Objekt befinden sich zwei Appartements, AppMuschel und AppSeestern.<br \/>\n\tDiese Appartements k&ouml;nnen einzeln gebucht werden, Sie k&ouml;nnen aber auch das ganze Haus buchen, wobei Sie dann einen aus der Preisinfo ersichtlichen Rabatt erhalten. Die Beschreibung der Appartements finden Sie unten.<br \/>\n\t6.8 km vom Meer, an einer Nebenstrasse gelegen. Zur Mitbenutzung: Grundst&uuml;ck, Garten. Im Hause: Zentralheizung. Parkplatz beim Haus. Lebensmittelgesch&auml;ft 250 m, Supermarkt 1.4 km, Restaurant 1.3 km, Cafe 1.2 km, Bushaltestelle 600 m, Bahnstation &#39;Norden&#39; 1.5 km. Freibad 6.8 km, Hallenbad 4 km, Sandstrand, Strandbad 6.8 km, Tennis, Tennishalle 4.7 km, Reitstall 200 m. Im 200 m entfernten Reitstall k&ouml;nnen nach Absprache und gegen Geb&uuml;hr eigene Pferde in Gastboxen untergebracht werden.\n<\/p>\n<hr style=\"color:#cccccc; width:100%; margin:4px 0px 14px 0px;\" \/>\n<p>\n\t<strong>Objekt Buttje, Uferpromenade 2, 12345 Urlaubsort<\/strong>\n<\/p>\n<p>\n\t<img decoding=\"async\" loading=\"lazy\" alt=\"\" height=\"150\" src=\"https:\/\/onbusys.de\/101\/OBS\/Demos\/AppSeestern.jpg\" style=\"float:right;margin-left:5px; margin-bottom:3px;\" width=\"200\" \/>\n<\/p>\n<p>\n\tErdgeschosswohnung mit ca. 45 qm reiner Wohnfl&auml;che, Terrasse(S&uuml;dseite) mit Gartenm&ouml;beln und Sonnenschirm, Garten, massiver separater Abstellraum f&uuml;r Fahrr&auml;der.<br \/>\n\tDie Wohnung besteht aus einem Wohn-Esszimmer mit einer K&uuml;chenzeile, einem Schlafzimmer mit Doppelbett, Kleiderschrank und Kinderbett, einem Bad mit WC und Dusche, einer Garderobe und einem Abstellraum. Das Ausziehsofa der Eckgarnitur im Wohnzimmer bietet zwei weitere Schlafgelegenheiten.<br \/>\n\t6.8 km vom Meer, an einer Nebenstrasse gelegen. Zur Mitbenutzung: Grundst&uuml;ck, Garten. Im Hause: Zentralheizung. Parkplatz beim Haus. Lebensmittelgesch&auml;ft 250 m, Supermarkt 1.4 km, Restaurant 1.3 km, Cafe 1.2 km, Bushaltestelle 600 m, Bahnstation &#39;Norden&#39; 1.5 km. Freibad 6.8 km, Hallenbad 4 km, Sandstrand, Strandbad 6.8 km, Tennis, Tennishalle 4.7 km, Reitstall 200 m. Im 200 m entfernten Reitstall k&ouml;nnen nach Absprache und gegen Geb&uuml;hr eigene Pferde in Gastboxen untergebracht werden.\n<\/p>\n<hr style=\"color:#cccccc; width:100%; margin:4px 0px 14px 0px;\" \/>\n<p>\n\t<strong>Objekt Wald, Forstweg 44, 12345 Urlaubsort<\/strong>\n<\/p>\n<p>\n\t<img decoding=\"async\" loading=\"lazy\" alt=\"\" height=\"150\" src=\"https:\/\/onbusys.de\/101\/OBS\/Demos\/Wald.jpg\" style=\"float:right;margin-left:5px; margin-bottom:3px;\" width=\"200\" \/>\n<\/p>\n<p>\n\t3-Zimmer-Wohnung 50 qm im 1. Stock: Wohn-\/Esszimmer mit Satelitten-TV, Radio. 1 Zimmer mit 2 Betten. 1 Zimmer mit 1 x 2 Etagenbetten. Kochnische. Dusche\/WC.<br \/>\n\tGanzj&auml;hrige Vermietung, Gaszentralheizung.<br \/>\n\tMehrfamilienhaus in zentraler Lage in einer ruhigen Nebenstrasse.<br \/>\n\tIm Hause: Fahrstuhl, Zentralheizung. Supermarkt 100 m, Restaurant, Cafe 50 m, Bushaltestelle 150 m. Freibad 1.1 km, Hallenbad 7.6 km, Sandstrand 1.2 km, Golfplatz 46 km, Reitstall 1.5 km.<br \/>\n\tEs stehen drei Fahrr&auml;der und ein Bollerwagen kostenlos zur Verf&uuml;gung, der Parkplatz befindet sich direkt vor dem Haus.\n<\/p>\n<h3>\n\tHTML-Code des Content-Bereiches<br \/>\n<\/h3>\n<p>\n\tHinweise zum Einf&uuml;gen der Scroll-Multi-Belegungs&uuml;bersicht in Ihre Seite\n<\/p>\n<p>\n\tDie <span style=\"color:#FF8C00;\">farblich markierten Zeilen<\/span> stellen die zur Einbindung der Scroll-Multi-Belegungs&uuml;bersicht notwendigen Teile dar, wobei manche &lt;p&gt;- bzw. &lt;div&gt;-Tags und Abst&auml;nde zwischen den Abs&auml;tzen layoutbedingt automatisch eingef&uuml;gt wurden.<br \/>\n\tDiese Zeilen m&uuml;ssen Sie an die entsprechende Stelle in Ihrer Seite kopieren, die <span style=\"color:#FF0000;\">rot<\/span> markierten Teile m&uuml;ssen Sie durch die Werte Ihrer Installation ersetzen (Pfad zum Ordner OBS, evt. Objektnamen).<br \/>\n\tDurch <span style=\"color:#FF8C00;\">die Zeilen<\/span> wird die Bibliothek (1.Zeile), das Buchungsformular (3. und 4. Zeile) unsichtbar und die Scroll-Multi-Belegungs&uuml;bersicht (6. und 7. Zeile) sichtbar eingebunden.<br \/>\n\tEvt. vorhandene Zeilenumbr&uuml;che in diesen Bereichen sind durch das Layout bedingt und sollten vermieden werden.\n<\/p>\n<p>\n\tIn&nbsp;der <a href=\"https:\/\/onbusys.de\/101\/demo\/integration\/bibliothek\" target=\"_blank\">OnBuSys-JS-Bibliothek<\/a> werden die eingef&uuml;gten Teile ausf&uuml;hrlich beschrieben, zus&auml;tzlich erhalten Sie hier Hinweise zu den Parametern der Funktion in der 5. Zeile:<br \/>\n\tabs_freeOnTop(&quot;235px&quot;,&quot;main&quot;,&quot;primary&quot;,&quot;secondary&quot;,&quot;&quot;);<br \/>\n\t&quot;235px&quot; ist der Default-Wert der H&ouml;he des Freiraums &uuml;ber den entsprechenden Elementen<br \/>\n\t&quot;main&quot; ist die ID des DIV-Containers, der die Spalten des Layouts umfasst<br \/>\n\t&quot;primary&quot;: Das Element mit dieser ID erh&auml;lt einen Freiraum von 235px (Default-Wert)<br \/>\n\t&quot;secondary&quot;: Das Element mit dieser ID erh&auml;lt einen Freiraum von 235px (Default-Wert)<br \/>\n\t&quot;&quot;: Der 5. Parameter wird hier nicht verwendet\n<\/p>\n<p>\n\tBeginn des Quellcodes der Demoseite\n<\/p>\n<p>\n\t&lt;p&gt;<br \/>\n\t<span style=\"color:#FF8C00;\">&lt;script type=&quot;text\/javascript&quot; src=&quot;http:\/\/<\/span><span style=\"color:#FF0000;\">onbusys.de\/101<\/span><span style=\"color:#FF8C00;\">\/OBS\/obs_lib.js&quot;&gt;&lt;\/script&gt;<\/span><br \/>\n\t<span style=\"color:#FF8C00;\">&lt;script type=&quot;text\/javascript&quot;&gt;<br \/>\n\tvar belbuchkal = new belbuchkal(250,0,556,&quot;background-color:#ffffff;border:0px solid #909090&quot;,true);<br \/>\n\tbelbuchkal.erstelle();<br \/>\n\taddLoadEvent(function(){abs_freeOnTop(&quot;235px&quot;,&quot;main&quot;,&quot;primary&quot;,&quot;secondary&quot;,&quot;&quot;);});<br \/>\n\tvar multibeldiv1 = new abs_multibeldiv(&quot;<\/span><span style=\"color:#FF0000;\">onbusys.de\/101<\/span><span style=\"color:#FF8C00;\">&quot;,&quot;&quot;,6,2,860,&quot;left:40px&quot;,&quot;top:10px&quot;,&quot;de-DE&quot;);<br \/>\n\tmultibeldiv1.erstelle();<br \/>\n\t&lt;\/script&gt;<\/span><br \/>\n\t&lt;\/p&gt;\n<\/p>\n<p>\n\t&lt;p&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;&lt;strong&gt;Scroll-Multi-&amp;Uuml;bersicht als erstes Element des Content-Bereichs&lt;\/strong&gt;<br \/>\n\t&lt;\/p&gt;\n<\/p>\n<p>\n\t&lt;p&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;&lt;strong&gt;Bei diesem 2-Spalten-Layout passt die Scroll-Belegungs&amp;uuml;bersicht in keine der beiden Spalten. Deshalb muss die Scroll-Belegungs&amp;uuml;bersicht absolut positioniert eingebunden und mit der Funktion &amp;#39;abs_freeOnTop()&amp;#39; Freiraum &amp;uuml;ber den sonst verdeckten Elementen geschaffen werden. Drei Elemente sind sichtbar, die restlichen k&amp;ouml;nnen per Scrollbar erreicht werden. Die Objekte der Scroll-Belegungs&amp;uuml;bersicht haben einen Link zum &amp;Ouml;ffnen des Buchungsformulars auf der gleichen Seite.&lt;br \/&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;Der zugeh&amp;ouml;rige HTML-Code wird am Ende der Seite angezeigt.&lt;\/strong&gt;<br \/>\n\t&lt;\/p&gt;\n<\/p>\n<p>\n\t&lt;hr style=&quot;color:#cccccc; width:100%; margin:4px 0px 14px 0px;&quot; \/&gt;<br \/>\n\t&lt;p id=&quot;objekt-1&quot;&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;&lt;strong&gt;Objekt Fewo Berg, Strandweg 4, 12345 Urlaubsort&lt;\/strong&gt;<br \/>\n\t&lt;\/p&gt;\n<\/p>\n<p>\n\t&lt;p&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;&lt;img alt=&quot;&quot; height=&quot;150&quot; src=&quot;https:\/\/onbusys.de\/101\/OBS\/Demos\/AppHaus.jpg&quot; style=&quot;float:right;margin-left:5px; margin-bottom:3px;&quot; width=&quot;200&quot; \/&gt;<br \/>\n\t&lt;\/p&gt;\n<\/p>\n<p>\n\t&lt;p&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;In diesem Objekt befinden sich zwei Appartements, AppMuschel und AppSeestern.&lt;br \/&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;Diese Appartements k&amp;ouml;nnen einzeln gebucht werden, Sie k&amp;ouml;nnen aber auch das ganze Haus buchen, wobei Sie dann einen aus der Preisinfo ersichtlichen Rabatt erhalten. Die Beschreibung der Appartements finden Sie unten.&lt;br \/&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;6.8 km vom Meer, an einer Nebenstrasse gelegen. Zur Mitbenutzung: Grundst&amp;uuml;ck, Garten. Im Hause: Zentralheizung. Parkplatz beim Haus. Lebensmittelgesch&amp;auml;ft 250 m, Supermarkt 1.4 km, Restaurant 1.3 km, Cafe 1.2 km, Bushaltestelle 600 m, Bahnstation &amp;#39;Norden&amp;#39; 1.5 km. Freibad 6.8 km, Hallenbad 4 km, Sandstrand, Strandbad 6.8 km, Tennis, Tennishalle 4.7 km, Reitstall 200 m. Im 200 m entfernten Reitstall k&amp;ouml;nnen nach Absprache und gegen Geb&amp;uuml;hr eigene Pferde in Gastboxen untergebracht werden.<br \/>\n\t&lt;\/p&gt;\n<\/p>\n<p>\n\t&lt;hr style=&quot;color:#cccccc; width:100%; margin:4px 0px 14px 0px;&quot; \/&gt;<br \/>\n\t&lt;p&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;&lt;strong&gt;Objekt Buttje, Uferpromenade 2, 12345 Urlaubsort&lt;\/strong&gt;<br \/>\n\t&lt;\/p&gt;\n<\/p>\n<p>\n\t&lt;p&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;&lt;img alt=&quot;&quot; height=&quot;150&quot; src=&quot;https:\/\/onbusys.de\/101\/OBS\/Demos\/AppSeestern.jpg&quot; style=&quot;float:right;margin-left:5px; margin-bottom:3px;&quot; width=&quot;200&quot; \/&gt;<br \/>\n\t&lt;\/p&gt;\n<\/p>\n<p>\n\t&lt;p&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;Erdgeschosswohnung mit ca. 45 qm reiner Wohnfl&amp;auml;che, Terrasse(S&amp;uuml;dseite) mit Gartenm&amp;ouml;beln und Sonnenschirm, Garten, massiver separater Abstellraum f&amp;uuml;r Fahrr&amp;auml;der.&lt;br \/&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;Die Wohnung besteht aus einem Wohn-Esszimmer mit einer K&amp;uuml;chenzeile, einem Schlafzimmer mit Doppelbett, Kleiderschrank und Kinderbett, einem Bad mit WC und Dusche, einer Garderobe und einem Abstellraum. Das Ausziehsofa der Eckgarnitur im Wohnzimmer bietet zwei weitere Schlafgelegenheiten.&lt;br \/&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;6.8 km vom Meer, an einer Nebenstrasse gelegen. Zur Mitbenutzung: Grundst&amp;uuml;ck, Garten. Im Hause: Zentralheizung. Parkplatz beim Haus. Lebensmittelgesch&amp;auml;ft 250 m, Supermarkt 1.4 km, Restaurant 1.3 km, Cafe 1.2 km, Bushaltestelle 600 m, Bahnstation &amp;#39;Norden&amp;#39; 1.5 km. Freibad 6.8 km, Hallenbad 4 km, Sandstrand, Strandbad 6.8 km, Tennis, Tennishalle 4.7 km, Reitstall 200 m. Im 200 m entfernten Reitstall k&amp;ouml;nnen nach Absprache und gegen Geb&amp;uuml;hr eigene Pferde in Gastboxen untergebracht werden.<br \/>\n\t&lt;\/p&gt;\n<\/p>\n<p>\n\t&lt;hr style=&quot;color:#cccccc; width:100%; margin:4px 0px 14px 0px;&quot; \/&gt;<br \/>\n\t&lt;p&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;&lt;strong&gt;Objekt Wald, Forstweg 44, 12345 Urlaubsort&lt;\/strong&gt;<br \/>\n\t&lt;\/p&gt;\n<\/p>\n<p>\n\t&lt;p&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;&lt;img alt=&quot;&quot; height=&quot;150&quot; src=&quot;https:\/\/onbusys.de\/101\/OBS\/Demos\/Wald.jpg&quot; style=&quot;float:right;margin-left:5px; margin-bottom:3px;&quot; width=&quot;200&quot; \/&gt;<br \/>\n\t&lt;\/p&gt;\n<\/p>\n<p>\n\t&lt;p&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;3-Zimmer-Wohnung 50 qm im 1. Stock: Wohn-\/Esszimmer mit Satelitten-TV, Radio. 1 Zimmer mit 2 Betten. 1 Zimmer mit 1 x 2 Etagenbetten. Kochnische. Dusche\/WC.&lt;br \/&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;Ganzj&amp;auml;hrige Vermietung, Gaszentralheizung.&lt;br \/&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;Mehrfamilienhaus in zentraler Lage in einer ruhigen Nebenstrasse.&lt;br \/&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;Im Hause: Fahrstuhl, Zentralheizung. Supermarkt 100 m, Restaurant, Cafe 50 m, Bushaltestelle 150 m. Freibad 1.1 km, Hallenbad 7.6 km, Sandstrand 1.2 km, Golfplatz 46 km, Reitstall 1.5 km.&lt;br \/&gt;<br \/>\n\t&nbsp;&nbsp; &nbsp;Es stehen drei Fahrr&amp;auml;der und ein Bollerwagen kostenlos zur Verf&amp;uuml;gung, der Parkplatz befindet sich direkt vor dem Haus.<br \/>\n\t&lt;\/p&gt;<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Scroll-Multi-&Uuml;bersicht als erstes Element des Content-Bereichs Bei diesem 2-Spalten-Layout passt die Scroll-Belegungs&uuml;bersicht in keine der beiden Spalten. Deshalb muss die Scroll-Belegungs&uuml;bersicht absolut positioniert eingebunden und mit der Funktion &#39;abs_freeOnTop()&#39; Freiraum &uuml;ber den sonst verdeckten Elementen geschaffen werden. Drei Elemente sind sichtbar, die restlichen k&ouml;nnen per Scrollbar erreicht werden. Die Objekte der Scroll- Belegungs&uuml;bersicht haben einen [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":212,"menu_order":1,"comment_status":"closed","ping_status":"closed","template":"","meta":[],"_links":{"self":[{"href":"https:\/\/onbusys.de\/wp101\/wp-json\/wp\/v2\/pages\/221"}],"collection":[{"href":"https:\/\/onbusys.de\/wp101\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/onbusys.de\/wp101\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/onbusys.de\/wp101\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/onbusys.de\/wp101\/wp-json\/wp\/v2\/comments?post=221"}],"version-history":[{"count":8,"href":"https:\/\/onbusys.de\/wp101\/wp-json\/wp\/v2\/pages\/221\/revisions"}],"predecessor-version":[{"id":392,"href":"https:\/\/onbusys.de\/wp101\/wp-json\/wp\/v2\/pages\/221\/revisions\/392"}],"up":[{"embeddable":true,"href":"https:\/\/onbusys.de\/wp101\/wp-json\/wp\/v2\/pages\/212"}],"wp:attachment":[{"href":"https:\/\/onbusys.de\/wp101\/wp-json\/wp\/v2\/media?parent=221"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}