在調整大小，使用資產功能laravel

我有一個裝有asset laravel功能的圖像頭加載圖像：在調整大小，使用資產功能laravel

<img class="logo" src="{{ asset('images/logo-long.gif') }}" id="logo-navbar"></img>

而在我的JS腳本，我想它來檢查時的大小窗口的低於700像素，在img標籤變化

所以，我實現了這個的src屬性附加傷害：

$(window).resize(function(){ 
    width = $(window).width(); 
    if(width <= 700){ 
     $('#logo-navbar').attr('src', '??'); 
    }else{ 
     $('#logo-navbar').attr('src', '??'); 
    } 
});

但我不不知道如何告訴我的腳本生成類似laravel資產功能的路徑..

任何想法？

來源

2016-09-20 Baptiste Arnaud

您也可以簡單地使用HTML''標籤在給定視口和不使用Javascript的情況下提供不同的圖片 –

當你使用JS來改變圖像的URL你不應該使用PHP。這是不好的做法。只需手動創建圖像的URL：

var imageBig = '/images/logo-long.gif'; 
var imageSmall = '/images/logo-sm.gif';

來源

2016-09-20 14:49:34

好的，但網址取決於我在哪個網頁... –

如果您只有兩個標識使用絕對路徑而不是相對路徑（'/ images/logo.gif'而不是'images/logo.gif'）。此路徑將在所有頁面上運行。 http://www.natashabanegas.com/use-absolute-paths-instead-of-relative-to-link-to-css-js-and-media-files/ –

哦！好！謝謝你，先生！ –

這通常不是這樣做的最佳方法，但你可以這樣做：

的JavaScript：

$(window).resize(function(){ 
    width = $(window).width(); 
    if(width <= 700){ 
     $('#logo-navbar').attr('src', '/getAsset/images/logo-long.gif'); 
    }else{ 
     $('#logo-navbar').attr('src', '/getAsset/images/logo-long.gif'); 
    } 
});

routes.php文件

Route::get("/getAsset/{any}", function ($asset) { 
     return redirect(asset($asset)); 
})->where('any', '.*');

來源

2016-09-20 14:56:04 apokryfos

我這樣做有兩種方法。

我要麼有一些全局容器

var myApp = {};

其中I然後可以經由視圖分配不同的值，我賦值直列

myApp.url = {{ asset('/') }}

，或者如果JavaScript是在視圖

$(window).resize(function(){ 
    var assetUrl = "{{ asset('/') }}"; 
    width = $(window).width(); 
    if(width <= 700){ 
     $('#logo-navbar').attr('src', assetURL +'/images/logo-long.gif'); 
    }else{ 
     $('#logo-navbar').attr('src', assetURL + '/images/logo-long.gif'); 
    } 
});

應該注意我通常使用url（）而不是asset（） - 我不是su如果它能以完全相同的方式工作。

來源

2016-09-20 15:09:27

在調整大小，使用資產功能laravel

回答

相關問題