鉻似乎不正常運行我的腳本......有些時候

我正在開發ASP.NET MVC的一個網站，是應該去住下月初，我有一個問題，我可以」找不到原因也不解決。鉻似乎不正常運行我的腳本......有些時候

有與圖像滑塊我寫我自己的一頁。一般來說，它沒有問題。它不會在IE或Firefox中造成麻煩，並且Firebug不會拋出任何錯誤。但是，Chrome似乎並未在大約50％的時間內正確運行初始化腳本。有時它起作用，有時它不起作用。設置圖像位置和調整滑塊主體大小的函數與調用窗口大小時調用的函數相同，只是在初始化時直接從構造函數調用它。

如果初始化初始化失敗，函數會得到正確執行，並且一旦窗口調整大小或刷新頁面（在這兩種情況下再次調用調整大小函數），滑塊都會工作。

我不知道從哪裏開始查找問題。有沒有像螢火蟲鉻，所以我可以看看事情可能出錯？因爲這個問題從來沒有出現在Firefox，Firebug是在這種情況下有點沒用......

不管怎麼說，這裏的構造和調整尺寸功能，萬一有人察覺一個明顯的問題。

構造：

function ImageSlider(container_id, next_button_id, prev_button_id, image_class, fullscreen_close_icon){ 
this.container = $(container_id); 
this.images = this.container.children("img" + image_class); 
this.image_comments = this.container.contents("div" + image_class); 
this.current_image = 0; 

if (!fullscreen_close_icon) 
{ 
    this.close_icon = null; 
} 
else 
{ 
    this.close_icon = fullscreen_close_icon; 

} 

this.body_overflow = $("body").css("overflow");    //storing the original overflow of the body, because we're going to hide for the fullscreen view of the image 

//initialising images 
this.resize(); 
for (var i = 1; i < this.images.length; ++i) 
{ 
    this.images.eq(i).css("opacity", "0"); 
    this.image_comments.eq(i).css("opacity", "0"); 
} 

var nextbutton = this.container.find(next_button_id); 
var prevbutton = this.container.find(prev_button_id); 
if (nextbutton == null || nextbutton.length == 0) 
{ 
    nextbutton = $(next_button_id); 
} 
if (prevbutton == null || prevbutton.length == 0) 
{ 
    prevbutton = $(prev_button_id); 
} 
var that = this; 
nextbutton.click(function(){that.nextImage()}); 
prevbutton.click(function() { that.prevImage() }); 

if (this.close_icon != null) 
{ 
    this.container.click(function() { that.fullScreenImage() }); 
} 
$(window).resize(function(){that.resize()});}

調整功能：

ImageSlider.prototype.resize = function() { 
var tallestelement = 0; 
var tallestsize = 0; 
var topoffset = this.images.eq(0).outerHeight(true) + this.image_comments.eq(0).outerHeight(true); 
for (var i = 1; i < this.images.length; ++i) 
{ 
    //position the current element at the top of the container 
    this.images.eq(i).css("top", (topoffset * -1)); 
    this.image_comments.eq(i).css("top", (topoffset * -1)); 
    //measure the height of the current element, image and text 
    var elementheight = this.images.eq(i).outerHeight(true) + this.image_comments.eq(i).outerHeight(true); 
    //add height of the current element to the total offset 
    topoffset = topoffset + elementheight; 
    //check if the current element is the tallest so far in the slider 
    if (elementheight > tallestsize) 
    { 
     tallestsize = elementheight; 
     tallestelement = i; 
    } 
} 

//resize the container to fit the tallest element 
this.container.css("height", this.images.eq(tallestelement).outerHeight(true) + this.image_comments.eq(tallestelement).outerHeight(true) + "px");}

和呼叫在CSHTML構造：

<script> 
$(document).ready(function() { 
    var slider = new ImageSlider("#slider_image_wrapper", "#upbutton", "#downbutton", ".image", "@Url.Content("~/Content/Images/close.png")"); 
});

我幾乎得到的感覺， $（文檔）.ready在創建所有id之前被調用得太早，但我無法驗證。

來源

2015-05-27 UncleBob

你的問題的標題必須是最之一，如果不是最，廣泛的頭銜，我有在這個網站上看到過。 – ctwheels

Chrome擁有驚人的開發人員工具 - 按F12鍵。 –

它看起來像你的大小調整功能取決於有圖像的完整'outerHeight' - 但如果它能夠在'$（文件）.ready'運行，這些圖像可能沒有完全加載。你是否證實你的函數可以運行？如果它運行，如果每個圖像的'elementheight'看起來都OK？ –

我有同樣的問題，我的擴展，所以我把延時3秒左右在我的劇本通過的setInterval

來源

2017-08-01 03:32:11

鉻似乎不正常運行我的腳本......有些時候

回答

相關問題