创建更新的个人资料照片 jquery 和 bootstrap

我正在尝试执行功能
update profile picture

也 facebook update profile picture option.like, 当光标位于用户身上时，可以获得更新 profile picture div 上面在他的图片中，当用户将按下此时 div bootstrap 该模型将打开，这将询问配置文件图像。

到目前为止我所做的代码
http://jsfiddle.net/axtruo/e4pamhe2/6/

<div class="col-sm-4">

<img assets="" avatar2x.jpg'"="" bootstrap="" class="img-thumbnail" img="" profiles="" src="&lt;img src=" style="width:100%"/>

<div class="picture-hover">Update Profile Picture</div>

</div>


我同时遇到的问题是那个
picture-hover

没有显示在图像上方 facebook.

第二，我可以显示用于加载图片的模型
picture-hover

纽扣。

请说明正确的方向
2021-03-20 添加评论
分享

没有找到相关结果

    已邀请:

    莫问

    赞同来自:

    好吧，U. Bootstrap 没有人自己的图像强加，因此在不编写自己的代码的情况下无法创建它。

    如果您遵循以下示例，我发现了哪个 Google, 您可以如下征服：

    http://www.bootply.com/90238
    HTML


    <div class="container">
    
<div class="row">
    
<div class="col-md-3">
    
<div class="thumbnail">
    
<div class="caption">
    
<h4>Thumbnail Headline</h4>
    
<p>short thumbnail description</p>
    
<p><a class="label label-danger" href="" rel="tooltip" title="Zoom">Zoom</a>
    
<a class="label label-default" href="" rel="tooltip" title="Download now">Download</a></p>
    
</div>
    
<img alt="..." src="[url=http://lorempixel.com/400/300/sports/1/"/>]http://lorempixel.com/400/300/sports/1/"/>[/url]
    
</div>
    
</div>
    
</div>


    CSS


    .thumbnail {
    
 position:relative;
    
 overflow:hidden;
    
}
    

    
.caption {
    
 position:absolute;
    
 top:0;
    
 right:0;
    
 background:rgba/66, 139, 202, 0.75/;
    
 width:100%;
    
 height:100%;
    
 padding:2%;
    
 display: none;
    
 text-align:center;
    
 color:#fff !important;
    
 z-index:2;
    
}


    jQuery


    $/'.thumbnail'/.hover/
    
 function//{
    
 $/this/.find/'.caption'/.slideDown/250/; //.fadeIn/250/
    
 },
    
 function//{
    
 $/this/.find/'.caption'/.slideUp/250/; //.fadeOut/205/
    
 }
    
 /;


    </div>
    <div class="answer_text">
    http://wsnippets.com/fancy-pro ... -php/
    </div>
    2021-03-20 0 0
    分享
    为什么被折叠? 0 个回复被折叠

    要回复问题请先登录或注册

    Copyright © 2023, All Rights Reserved