如何使用jQuery在另一個元素的元素中顯示圖像

-3

我想使用jQuery選擇並顯示圖像。
我試圖clicktile_details div和顯示tile__media圖像在col-md-6與jQuery。如何使用jQuery在另一個元素的元素中顯示圖像

<div class="tile"> 
    <div class="tile__media"> 
    <img class="tile__img" src="https://s3-us-west-2.amazonaws.com/s.cdpn.io/70390/show-18.jpg" alt="" /> 
    </div> 
    <div class="tile__details"> 
    <div class="tile__title"> 
     Top Gear 
    </div> 
    </div> 
</div> 


<div class="container-fluid" style="display:none"> 
    <div class="row"> 
    <div class="col-md-6"> 
     Lorem ipsum dolor sit amet, consectetur adipisicing elit. Itaque eveniet reprehenderit, consequatur perferendis repellendus omnis libero laboriosam nostrum tenetur nulla dolores quos id delectus quo obcaecati eaque provident? Maxime, atque. Lorem ipsum 
     dolor sit amet, consectetur adipisicing elit. Itaque eveniet reprehenderit, consequatur perferendis repellendus omnis libero laboriosam nostrum tenetur nulla dolores quos id delectus quo obcaecati eaque provident? Maxime, atque. Lorem ipsum dolor 
     sit amet, consectetur adipisicing elit. Itaque eveniet reprehenderit, consequatur perferendis repellendus omnis libero laboriosam nostrum tenetur nulla dolores quos id delectus quo obcaecati eaque provident? Maxime, atque. Lorem ipsum dolor sit 
     amet, consectetur adipisicing elit. Itaque eveniet reprehenderit, consequatur perferendis repellendus omnis libero laboriosam nostrum tenetur nulla dolores quos id delectus quo obcaecati eaque provident? Maxime, atque. Lorem ipsum dolor sit amet, 
     consectetur adipisicing elit. Itaque eveniet reprehenderit, consequatur perferendis repellendus omnis libero laboriosam nostrum tenetur nulla dolores quos id delectus quo obcaecati eaque provident? Maxime, atque. 
    </div> 
    <div class="col-md-6"> 
     //Display Image 
    </div> 
    </div> 
</div>

來源

2017-07-07 Cognosys TausibR

人們downvoting因爲你不顯示任何努力，通過自己來做。添加一些你已經嘗試過的代碼，也許相關的CSS。 – user5014677

請發佈有問題的代碼，最好在演示問題的工作片段中，以便我們瞭解可能的原因。請參閱[**我如何提出一個好問題**]（https://stackoverflow.com/help/how-to-ask）以及如果適用，[**如何創建最小，完整和可驗證示例**]（https://stackoverflow.com/help/mcve） – Nope

還因爲您的指示不清楚，引導程序的html是什麼？「//顯示圖片」評論意味着什麼？ – Lewk

如果我正確地理解了這個問題，您想從'.tile__media'div中獲取圖像並將其設置爲該div的內容。如果你給DIV的標識，這可以通過下面的jQuery來實現：

$(".tile__details").click(function(e) { 
    $('#imageDiv').html($('.tile__media').html()); 
});

jsFiddle

更新：如果你希望它是動態的，根據你點擊後的圖像，你可以克隆圖片點擊進入div。代碼如下：

$(".tile__img").click(function(e) { 
    $('#imageDiv').html($(this).clone()); 
});

jsFiddle

來源

2017-07-07 09:35:36 Joel

其實我正在創建滑塊。如果我點擊任何圖像，它會在另一個div中顯示底部。 –

我現在會更新我的答案 – Joel

好的。和Thanx。 :)我試圖創建像netflix幻燈片。如果你知道如何創建plz幫助我。 –

如何使用jQuery在另一個元素的元素中顯示圖像

回答

相關問題