PSD-Tutorials.de
Forum für Design, Fotografie & Bildbearbeitung
Tutkit
Agentur
Hilfe
Kontakt
Start
Forum
Aktuelles
Besonderer Inhalt
Foren durchsuchen
Tutorials
News
Anmelden
Kostenlos registrieren
Aktuelles
Suche
Suche
Nur Titel durchsuchen
Von:
Menü
Anmelden
Kostenlos registrieren
App installieren
Installieren
JavaScript ist deaktiviert. Für eine bessere Darstellung aktiviere bitte JavaScript in deinem Browser, bevor du fortfährst.
Du verwendest einen veralteten Browser. Es ist möglich, dass diese oder andere Websites nicht korrekt angezeigt werden.
Du solltest ein Upgrade durchführen oder einen
alternativen Browser
verwenden.
Antworten auf deine Fragen:
Neues Thema erstellen
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
Webdesign: HTML/CSS, Responsive Design, Sass...
Nach Klick wird Seite weiß
Beitrag
<blockquote data-quote="Foos" data-source="post: 2554938" data-attributes="member: 72189"><p>Ich danke euch schon mal für die Antworten. Ja, die Seite hab ich damals von einem Wordpress Theme in HTML umgebaut. Bisher gab es da eigentlich nie Probleme. </p><p></p><p>Es geht mir um die Links genau. Es öffnet sich eben immer die weiße Seite nach einem Klick. </p><p></p><p>Ich denke auch, dass es vielleicht irgendwo in der functions.js liegt. Aber ich weiß nicht wo, ich was ändern soll <img src="/styles/default/xenforo/smilies/zwinker.gif" class="smilie" loading="lazy" alt=";)" title="Wink ;)" data-shortname=";)" /> </p><p></p><p>Die functions.js sieht so aus: </p><p>[code=JavaScript]/**</p><p>* Theme functions file</p><p>*</p><p>* Contains handlers for navigation, accessibility, header sizing</p><p>* footer widgets and Featured Content slider</p><p>*</p><p>*/</p><p>var _tablet_width = 950;</p><p>var _window = jQuery(window);</p><p>var _document = jQuery(document);</p><p>var _body = jQuery('body');</p><p></p><p>function fullHeight(el) {</p><p> return el.height() + parseInt(el.css('padding-top')) + parseInt(el.css('padding-bottom'))</p><p> + parseInt(el.css('border-top-width')) + parseInt(el.css('border-bottom-width'));</p><p>}</p><p></p><p>(function($) {</p><p> // Footer & header hacks for single pages</p><p> var fixed = {</p><p> header: false,</p><p> footer: false,</p><p> page: false,</p><p> container: false,</p><p> init: function() {</p><p> this.header = $('#masthead');</p><p> this.footer = $('#colophon');</p><p> if (this.header.length == 1 && this.footer.length == 1) {</p><p> this.page = $('#page');</p><p> this.container = $('.hentry');</p><p> _window.on('ready load resize', fixed.process);</p><p> }</p><p> },</p><p> process: function() {</p><p> if (_window.width() > _tablet_width) {</p><p> fixed.updateScroll();</p><p> _window.on('scroll.fixed', fixed.updateScroll);</p><p> }</p><p> else {</p><p> _window.off('scroll.fixed');</p><p> }</p><p> },</p><p> updateScroll: function() {</p><p> var admin_bar = 0;</p><p> if ($('#wpadminbar').length == 1) {</p><p> admin_bar = $('#wpadminbar').height();</p><p> }</p><p></p><p> var top = _window.scrollTop();</p><p> var header_height = fullHeight(fixed.header);</p><p> if (top <= header_height + admin_bar) {</p><p> fixed.header.css({</p><p> top: admin_bar - top</p><p> });</p><p> }</p><p> else {</p><p> fixed.header.css({</p><p> top: -1 * header_height - admin_bar</p><p> });</p><p> }</p><p></p><p> var from_top = top + _window.height() - admin_bar;</p><p> var page_height = fullHeight(fixed.page);</p><p> if (fixed.container.length == 1) {</p><p> var container_height = fullHeight(fixed.container) + header_height;</p><p> if (page_height < container_height) {</p><p> page_height = container_height;</p><p> }</p><p> }</p><p> var footer_height = fullHeight(fixed.footer);</p><p> if (page_height - from_top < footer_height) {</p><p> fixed.footer.css({</p><p> bottom: -1 * (page_height - from_top)</p><p> });</p><p> }</p><p> else {</p><p> fixed.footer.css({</p><p> bottom: -1 * footer_height</p><p> });</p><p> }</p><p> }</p><p> };</p><p> fixed.init();</p><p></p><p> // index gallery</p><p> var index = {</p><p> el: false,</p><p> images: [],</p><p> count: 0,</p><p> first_image: false,</p><p> init: function() {</p><p> this.el = $('body.home .main-content');</p><p> if (this.el.length == 1) {</p><p> this.update();</p><p> if (this.count != 0) {</p><p> this.first_image = $(this.images[0]);</p><p> _window.on('ready load resize', index.process);</p><p> }</p><p> }</p><p> },</p><p> update: function() {</p><p> index.images = index.el.find('img');</p><p> index.count = index.images.length;</p><p> },</p><p> process: function() {</p><p> var height = index.first_image.height();</p><p> var padding = parseInt(index.first_image.parents('.post').css('padding-right'));</p><p> index.images.each(function() {</p><p> var image = $(this);</p><p> if (_window.width() > _tablet_width) {</p><p> var ratio = image.attr('width') / image.attr('height');</p><p> var width = Math.round(height * ratio);</p><p> image.css('width', width + 'px');</p><p> image.parents('.post').css('width', width + padding + 'px');</p><p> }</p><p> });</p><p> }</p><p> };</p><p> index.init();</p><p></p><p> // single page gallery</p><p> var gallery = {</p><p> duration: 300,</p><p> el: false,</p><p> images: [],</p><p> count: 0,</p><p> first_image: false,</p><p> init: function() {</p><p> this.el = $('.gallery-animated');</p><p> if (this.el.length == 1) {</p><p> this.update();</p><p> if (this.count != 0) {</p><p> this.first_image = $(this.images[0]);</p><p> _window.on('ready load resize', gallery.process);</p><p> }</p><p> }</p><p> },</p><p> update: function() {</p><p> gallery.images = gallery.el.find('img');</p><p> gallery.count = gallery.images.length;</p><p> },</p><p> process: function() {</p><p> var height = gallery.first_image.height();</p><p> var padding = parseInt(gallery.first_image.parent().css('padding-right'));</p><p> gallery.images.each(function() {</p><p> var image = $(this);</p><p> image.off('click');</p><p> if (_window.width() > _tablet_width) {</p><p> var ratio = image.attr('width') / image.attr('height');</p><p> var width = Math.round(height * ratio);</p><p> image.css('width', width + 'px');</p><p> image.parent().css('width', width + padding + 'px');</p><p> image.on('click', function(event) {</p><p> event.preventDefault();</p><p> gallery.move(image);</p><p> });</p><p> }</p><p> });</p><p> },</p><p> move: function(image) {</p><p> var scroll = _window.scrollLeft();</p><p> var window_width = _window.width();</p><p> var offset = gallery.offset(image, window_width);</p><p> var index = image.parent().index();</p><p> if (offset == scroll) { // current image clicked</p><p> if (index != gallery.count - 1) { // not last image clicked</p><p> offset = gallery.offset($(gallery.images[index + 1]), window_width);</p><p> } else {</p><p> offset = gallery.offset(gallery.first_image, window_width);</p><p> }</p><p> }</p><p> if (offset != scroll) {</p><p> $('html, body').stop().animate({ scrollLeft: offset }, gallery.duration);</p><p> }</p><p> },</p><p> offset: function(image, window_width) {</p><p> var offset = image.offset().left;</p><p> var width = image.width();</p><p> if (width < window_width) {</p><p> offset -= Math.round((window_width - width) / 2);</p><p> }</p><p> return offset;</p><p> }</p><p> };</p><p> gallery.init();</p><p></p><p> // Infinite loading for index page</p><p> var loading = {</p><p> start_from: 500,</p><p> el: false,</p><p> nav: false,</p><p> loader: false,</p><p> enabled: true,</p><p> ajax: false,</p><p> init: function() {</p><p> this.el = $('.paging-navigation a');</p><p> if (this.el.length == 1) {</p><p> this.nav = this.el.parent();</p><p> this.loader = $('#infinite-loader');</p><p> _window.on('ready load resize scroll.loading', loading.process);</p><p> }</p><p> },</p><p> process: function() {</p><p> if (loading.enabled && !loading.ajax) {</p><p> var ajax = false;</p><p> if (_window.width() > _tablet_width) {</p><p> if (_window.scrollLeft() > _document.width() - _window.width() - loading.start_from) {</p><p> ajax = true;</p><p> }</p><p> }</p><p> else {</p><p> if (_window.scrollTop() > _document.height() - _window.height() - loading.start_from) {</p><p> ajax = true;</p><p> }</p><p> }</p><p> if (ajax) {</p><p> loading.loader.addClass('active');</p><p> loading.ajax = true;</p><p> $.ajax({</p><p> type: 'GET',</p><p> url: loading.el.attr('href'),</p><p> dataType: 'html',</p><p> success: function(response) {</p><p> var html = $(response);</p><p> var next_link = html.find('.paging-navigation a');</p><p> var items = html.find('#main-content .hentry');</p><p> items.each(function() {</p><p> $(this).insertBefore(loading.nav);</p><p> });</p><p> index.update();</p><p> index.process();</p><p> if (next_link.length == 1) {</p><p> loading.el.attr('href', next_link.attr('href'));</p><p> loading.ajax = false;</p><p> }</p><p> else {</p><p> _window.off('scroll.loading');</p><p> }</p><p> loading.loader.removeClass('active');</p><p> }</p><p> });</p><p> }</p><p> }</p><p> }</p><p> };</p><p> loading.init();</p><p></p><p> // load animations</p><p> var load_effect = {</p><p> duration: 300,</p><p> els: [],</p><p> loader: $('#infinite-loader'),</p><p> init: function() {</p><p> var els = $('.nav-menu > li');</p><p> if (els.length != 0) {</p><p> els.each(function() {</p><p> load_effect.els.push($(this));</p><p> });</p><p> }</p><p> $('a').on('click', function(e) {</p><p> e.preventDefault();</p><p> load_effect.loader.show();</p><p> var href = $(this).attr('href');</p><p> $('.site').css('opacity', 0);</p><p> setTimeout(function() {</p><p> window.location = href;</p><p> }, load_effect.duration);</p><p> });</p><p> _window.on('ready pageshow', function() {</p><p> load_effect.loader.show();</p><p> $('.site').css('opacity', 1);</p><p> setTimeout(function() {</p><p> load_effect.loader.hide();</p><p> if (load_effect.els.length != 0) {</p><p> load_effect.process();</p><p> }</p><p> }, load_effect.duration);</p><p> });</p><p> },</p><p> process: function() {</p><p> $(load_effect.els[0]).animate(</p><p> { opacity: 1 },</p><p> load_effect.duration,</p><p> function() {</p><p> load_effect.els.shift();</p><p> if (load_effect.els.length != 0) {</p><p> load_effect.process();</p><p> }</p><p> }</p><p> );</p><p> }</p><p> };</p><p> load_effect.init();</p><p></p><p> /**</p><p> * Menus for desktop view</p><p> */</p><p> function updateMenuItem(li) {</p><p> var ul = li.find('> ul');</p><p> if (!ul.hasClass('submenu-visible')) {</p><p> var parent = li.parent();</p><p> parent.find('li').removeClass('submenu-active');</p><p> li.addClass('submenu-active');</p><p> parent.find('ul').removeClass('submenu-visible');</p><p> ul.addClass('submenu-visible');</p><p> }</p><p> else {</p><p> li.removeClass('submenu-active');</p><p> ul.removeClass('submenu-visible');</p><p> ul.find('ul').removeClass('submenu-visible');</p><p> }</p><p> }</p><p></p><p> $('.site-navigation > div > ul > li').on('hover', function() {</p><p> var li = $(this);</p><p> updateMenuItem(li);</p><p> });</p><p></p><p> $('.site-navigation > div > ul > li > a').on('touchstart', function(e) {</p><p> if (_window.width() > _tablet_width) {</p><p> e.preventDefault();</p><p> var li = $(this).parent();</p><p> updateMenuItem(li);</p><p> }</p><p> });</p><p></p><p> // removes visible submenus on safari for bfcache (when back button is clicked)</p><p> _window.bind('pageshow', function(e) {</p><p> if (e.originalEvent.persisted) {</p><p> $('.submenu-visible').removeClass('submenu-visible');</p><p> $('.submenu-active').removeClass('submenu-active');</p><p> }</p><p> });</p><p></p><p> // Enable menu toggle for small screens.</p><p> (function() {</p><p> var nav = $('#primary-navigation');</p><p> if (!nav) {</p><p> return;</p><p> }</p><p></p><p> var button = $('.menu-toggle');</p><p> if (!button) {</p><p> return;</p><p> }</p><p></p><p> // Hide button if menu is missing or empty.</p><p> var menu = nav.find('.nav-menu');</p><p> if (!menu || !menu.children().length) {</p><p> button.addClass('hidden');</p><p> return;</p><p> }</p><p></p><p> $('.menu-toggle').on('click', function() {</p><p> loading.enabled = false;</p><p> _body.addClass('toggled-on');</p><p> });</p><p></p><p> $('#navigation-close').on('click', function() {</p><p> _body.removeClass('toggled-on');</p><p> loading.enabled = true;</p><p> });</p><p> })();</p><p>})(jQuery);</p><p>[/code]</p></blockquote><p></p>
[QUOTE="Foos, post: 2554938, member: 72189"] Ich danke euch schon mal für die Antworten. Ja, die Seite hab ich damals von einem Wordpress Theme in HTML umgebaut. Bisher gab es da eigentlich nie Probleme. Es geht mir um die Links genau. Es öffnet sich eben immer die weiße Seite nach einem Klick. Ich denke auch, dass es vielleicht irgendwo in der functions.js liegt. Aber ich weiß nicht wo, ich was ändern soll ;) Die functions.js sieht so aus: [code=JavaScript]/** * Theme functions file * * Contains handlers for navigation, accessibility, header sizing * footer widgets and Featured Content slider * */ var _tablet_width = 950; var _window = jQuery(window); var _document = jQuery(document); var _body = jQuery('body'); function fullHeight(el) { return el.height() + parseInt(el.css('padding-top')) + parseInt(el.css('padding-bottom')) + parseInt(el.css('border-top-width')) + parseInt(el.css('border-bottom-width')); } (function($) { // Footer & header hacks for single pages var fixed = { header: false, footer: false, page: false, container: false, init: function() { this.header = $('#masthead'); this.footer = $('#colophon'); if (this.header.length == 1 && this.footer.length == 1) { this.page = $('#page'); this.container = $('.hentry'); _window.on('ready load resize', fixed.process); } }, process: function() { if (_window.width() > _tablet_width) { fixed.updateScroll(); _window.on('scroll.fixed', fixed.updateScroll); } else { _window.off('scroll.fixed'); } }, updateScroll: function() { var admin_bar = 0; if ($('#wpadminbar').length == 1) { admin_bar = $('#wpadminbar').height(); } var top = _window.scrollTop(); var header_height = fullHeight(fixed.header); if (top <= header_height + admin_bar) { fixed.header.css({ top: admin_bar - top }); } else { fixed.header.css({ top: -1 * header_height - admin_bar }); } var from_top = top + _window.height() - admin_bar; var page_height = fullHeight(fixed.page); if (fixed.container.length == 1) { var container_height = fullHeight(fixed.container) + header_height; if (page_height < container_height) { page_height = container_height; } } var footer_height = fullHeight(fixed.footer); if (page_height - from_top < footer_height) { fixed.footer.css({ bottom: -1 * (page_height - from_top) }); } else { fixed.footer.css({ bottom: -1 * footer_height }); } } }; fixed.init(); // index gallery var index = { el: false, images: [], count: 0, first_image: false, init: function() { this.el = $('body.home .main-content'); if (this.el.length == 1) { this.update(); if (this.count != 0) { this.first_image = $(this.images[0]); _window.on('ready load resize', index.process); } } }, update: function() { index.images = index.el.find('img'); index.count = index.images.length; }, process: function() { var height = index.first_image.height(); var padding = parseInt(index.first_image.parents('.post').css('padding-right')); index.images.each(function() { var image = $(this); if (_window.width() > _tablet_width) { var ratio = image.attr('width') / image.attr('height'); var width = Math.round(height * ratio); image.css('width', width + 'px'); image.parents('.post').css('width', width + padding + 'px'); } }); } }; index.init(); // single page gallery var gallery = { duration: 300, el: false, images: [], count: 0, first_image: false, init: function() { this.el = $('.gallery-animated'); if (this.el.length == 1) { this.update(); if (this.count != 0) { this.first_image = $(this.images[0]); _window.on('ready load resize', gallery.process); } } }, update: function() { gallery.images = gallery.el.find('img'); gallery.count = gallery.images.length; }, process: function() { var height = gallery.first_image.height(); var padding = parseInt(gallery.first_image.parent().css('padding-right')); gallery.images.each(function() { var image = $(this); image.off('click'); if (_window.width() > _tablet_width) { var ratio = image.attr('width') / image.attr('height'); var width = Math.round(height * ratio); image.css('width', width + 'px'); image.parent().css('width', width + padding + 'px'); image.on('click', function(event) { event.preventDefault(); gallery.move(image); }); } }); }, move: function(image) { var scroll = _window.scrollLeft(); var window_width = _window.width(); var offset = gallery.offset(image, window_width); var index = image.parent().index(); if (offset == scroll) { // current image clicked if (index != gallery.count - 1) { // not last image clicked offset = gallery.offset($(gallery.images[index + 1]), window_width); } else { offset = gallery.offset(gallery.first_image, window_width); } } if (offset != scroll) { $('html, body').stop().animate({ scrollLeft: offset }, gallery.duration); } }, offset: function(image, window_width) { var offset = image.offset().left; var width = image.width(); if (width < window_width) { offset -= Math.round((window_width - width) / 2); } return offset; } }; gallery.init(); // Infinite loading for index page var loading = { start_from: 500, el: false, nav: false, loader: false, enabled: true, ajax: false, init: function() { this.el = $('.paging-navigation a'); if (this.el.length == 1) { this.nav = this.el.parent(); this.loader = $('#infinite-loader'); _window.on('ready load resize scroll.loading', loading.process); } }, process: function() { if (loading.enabled && !loading.ajax) { var ajax = false; if (_window.width() > _tablet_width) { if (_window.scrollLeft() > _document.width() - _window.width() - loading.start_from) { ajax = true; } } else { if (_window.scrollTop() > _document.height() - _window.height() - loading.start_from) { ajax = true; } } if (ajax) { loading.loader.addClass('active'); loading.ajax = true; $.ajax({ type: 'GET', url: loading.el.attr('href'), dataType: 'html', success: function(response) { var html = $(response); var next_link = html.find('.paging-navigation a'); var items = html.find('#main-content .hentry'); items.each(function() { $(this).insertBefore(loading.nav); }); index.update(); index.process(); if (next_link.length == 1) { loading.el.attr('href', next_link.attr('href')); loading.ajax = false; } else { _window.off('scroll.loading'); } loading.loader.removeClass('active'); } }); } } } }; loading.init(); // load animations var load_effect = { duration: 300, els: [], loader: $('#infinite-loader'), init: function() { var els = $('.nav-menu > li'); if (els.length != 0) { els.each(function() { load_effect.els.push($(this)); }); } $('a').on('click', function(e) { e.preventDefault(); load_effect.loader.show(); var href = $(this).attr('href'); $('.site').css('opacity', 0); setTimeout(function() { window.location = href; }, load_effect.duration); }); _window.on('ready pageshow', function() { load_effect.loader.show(); $('.site').css('opacity', 1); setTimeout(function() { load_effect.loader.hide(); if (load_effect.els.length != 0) { load_effect.process(); } }, load_effect.duration); }); }, process: function() { $(load_effect.els[0]).animate( { opacity: 1 }, load_effect.duration, function() { load_effect.els.shift(); if (load_effect.els.length != 0) { load_effect.process(); } } ); } }; load_effect.init(); /** * Menus for desktop view */ function updateMenuItem(li) { var ul = li.find('> ul'); if (!ul.hasClass('submenu-visible')) { var parent = li.parent(); parent.find('li').removeClass('submenu-active'); li.addClass('submenu-active'); parent.find('ul').removeClass('submenu-visible'); ul.addClass('submenu-visible'); } else { li.removeClass('submenu-active'); ul.removeClass('submenu-visible'); ul.find('ul').removeClass('submenu-visible'); } } $('.site-navigation > div > ul > li').on('hover', function() { var li = $(this); updateMenuItem(li); }); $('.site-navigation > div > ul > li > a').on('touchstart', function(e) { if (_window.width() > _tablet_width) { e.preventDefault(); var li = $(this).parent(); updateMenuItem(li); } }); // removes visible submenus on safari for bfcache (when back button is clicked) _window.bind('pageshow', function(e) { if (e.originalEvent.persisted) { $('.submenu-visible').removeClass('submenu-visible'); $('.submenu-active').removeClass('submenu-active'); } }); // Enable menu toggle for small screens. (function() { var nav = $('#primary-navigation'); if (!nav) { return; } var button = $('.menu-toggle'); if (!button) { return; } // Hide button if menu is missing or empty. var menu = nav.find('.nav-menu'); if (!menu || !menu.children().length) { button.addClass('hidden'); return; } $('.menu-toggle').on('click', function() { loading.enabled = false; _body.addClass('toggled-on'); }); $('#navigation-close').on('click', function() { _body.removeClass('toggled-on'); loading.enabled = true; }); })(); })(jQuery); [/code] [/QUOTE]
Bilder bitte
hier hochladen
und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Zitate einfügen…
Authentifizierung
Wenn ▲ = 5, ▼ = 2 und ■ = 7, was ist ▲ × ▼ + ■?
Antworten
Start
Forum
Sonstiges
Webdesign, Webentwicklung & Programmierung
Webdesign: HTML/CSS, Responsive Design, Sass...
Nach Klick wird Seite weiß
Oben