10182100208
/
style-transform-master
forked from 10185101162/style-transform-master
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 0 Wiki Activity
Browse Source

把训练图片放在了结果前面

master
nicole01101101zke 3 years ago
parent
79044154da
commit
c54554f87c
2 changed files with 112 additions and 130 deletions
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. +1
    -7
      style-transform-master/style-transform-master/html/css/style.css
  2. +111
    -123
      style-transform-master/style-transform-master/html/index.html

+ 1
- 7
style-transform-master/style-transform-master/html/css/style.css View File

@ -916,20 +916,14 @@ header.page-header .main-menu.minified{
.portfolio-items .portfolio-item{ .portfolio-items .portfolio-item{
width: 33%; width: 33%;
height: 400px; height: 400px;
position: relative;
position: absolute;
overflow: hidden; overflow: hidden;
display: table-cell;
vertical-align: middle;
text-align: center;
} }
.portfolio-items .portfolio-item img{ .portfolio-items .portfolio-item img{
height: 100%; height: 100%;
display: table-cell;
vertical-align: middle;
border: 1px solid #ffffff; border: 1px solid #ffffff;
width: 100%; width: 100%;
text-align: center;
} }
.portfolio-items .portfolio-item .portfolio-details-wrapper{ .portfolio-items .portfolio-item .portfolio-details-wrapper{

+ 111
- 123
style-transform-master/style-transform-master/html/index.html View File

@ -60,6 +60,9 @@
<a href="#services">SERVICES</a> <a href="#services">SERVICES</a>
</li> </li>
<li> <li>
<a href="#contact">START HERE</a>
</li>
<li>
<a href="#menuCard">MENU</a> <a href="#menuCard">MENU</a>
</li> </li>
<li> <li>
@ -71,9 +74,6 @@
<li> <li>
<a href="#clients">FEEDBACK</a> <a href="#clients">FEEDBACK</a>
</li> </li>
<li>
<a href="#contact">CONTACT US</a>
</li>
</ul> </ul>
</div> </div>
</div> </div>
@ -286,6 +286,114 @@
</div> </div>
</section> </section>
<section id="contact" class="section-wrapper contact-section" data-stellar-background-ratio="0.5">
<div class="parallax-overlay"></div>
<div class="container">
<div class="row">
<!-- Section Header -->
<div class="col-md-12 col-sm-12 col-xs-12 section-header wow fadeInDown">
<h2><span class="highlight-text">Contact Us</span></h2>
<p class="col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">We love feedback. Fill out
the form below and we'll get back to you as soon as possible. in minus distinctio dolores ipsam.
</p>
</div>
<!-- Section Header End -->
<div class="contact-details">
<!-- Contact Form -->
<div class="contact-form wow bounceInRight">
<!--NOTE: Update your email Id in "contact_me.php" file in order to receive emails from your contact form-->
<form name="sentMessage" id="contactForm" novalidate method="post">
<div class="col-md-6">
<img id="cropedBigImg0" src="" class="teams-slides col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1"/>
<input type="file" id="chooseImage0"
accept="image/gif,image/jpeg, image/png, image/jpg" />
<p class="help-block"></p>
</div>
<div class="col-md-6">
<img id="cropedBigImg1" src="" class="teams-slides col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1"/>
<input type="file" id="chooseImage1"
accept="image/gif,image/jpeg, image/png, image/jpg" />
</div>
<div class="col-md-12">
<textarea class="form-control" placeholder="请输入训练轮数" id="message"></textarea>
</div>
<div class="col-md-8 col-md-offset-2"><br>
<div id="success"> </div><button type="submit" class="btn btn-primary" onclick="window.location.href = '#portfolio'">Submit
Message</button>
</div>
</form>
<!-- <div class="div_model">
<img id="cropedBigImg0" src="images/0.png" class="div_model_img"/>
<input type="file"class="file" accept="image/gif,image/jpeg, image/png, image/jpg"id="chooseImage0">
</div> -->
<script>
function ProcessFile1(e) {
var src_img = document.getElementById('chooseImage0').files[0];
console.log(src_img);
if (src_img) {
var reader = new FileReader();
reader.onload = function (event) {
var txt = event.target.result;
$("#cropedBigImg0").attr('src', txt);//将图片base64字符串赋值给img的src
//console.log(txt)//base64
};
}
reader.readAsDataURL(src_img);
}
function ProcessFile2(e) {
var tar_img = document.getElementById('chooseImage1').files[0];
console.log(tar_img);
if (tar_img) {
var reader = new FileReader();
reader.onload = function (event) {
var txt = event.target.result;
$("#cropedBigImg1").attr('src', txt);//将图片base64字符串赋值给img的src
//console.log(txt)//base64
};
}
reader.readAsDataURL(tar_img);
}
function contentLoaded0() {
document.getElementById('chooseImage0').addEventListener('change',
ProcessFile1, false);
}
function contentLoaded1() {
document.getElementById('chooseImage1').addEventListener('change',
ProcessFile2, false);
}
// var model=document.getElementById('model');
// var input=model.querySelectorAll('input');
window.addEventListener("DOMContentLoaded", contentLoaded0, false);
window.addEventListener("DOMContentLoaded", contentLoaded1, false);
</script>
</div>
</div>
</div>
</section>
<section class="menus style3" id="menuCard"> <section class="menus style3" id="menuCard">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
@ -757,126 +865,6 @@
</section> </section>
<!-- Client Section End --> <!-- Client Section End -->
<section id="contact" class="section-wrapper contact-section" data-stellar-background-ratio="0.5">
<div class="parallax-overlay"></div>
<div class="container">
<div class="row">
<!-- Section Header -->
<div class="col-md-12 col-sm-12 col-xs-12 section-header wow fadeInDown">
<h2><span class="highlight-text">Contact Us</span></h2>
<p class="col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1">We love feedback. Fill out
the form below and we'll get back to you as soon as possible. in minus distinctio dolores ipsam.
</p>
</div>
<!-- Section Header End -->
<div class="contact-details">
<!-- Contact Form -->
<div class="contact-form wow bounceInRight">
<!--NOTE: Update your email Id in "contact_me.php" file in order to receive emails from your contact form-->
<form name="sentMessage" id="contactForm" novalidate method="post">
<div class="col-md-6">
<img id="cropedBigImg0" src="" class="teams-slides col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1"/>
<input type="file" id="chooseImage0"
accept="image/gif,image/jpeg, image/png, image/jpg" />
<p class="help-block"></p>
</div>
<div class="col-md-6">
<img id="cropedBigImg1" src="" class="teams-slides col-md-8 col-sm-10 col-xs-12 col-md-offset-2 col-sm-offset-1"/>
<input type="file" id="chooseImage1"
accept="image/gif,image/jpeg, image/png, image/jpg" />
</div>
<div class="col-md-12">
<textarea class="form-control" placeholder="请输入训练轮数" id="message"></textarea>
</div>
<div class="col-md-8 col-md-offset-2"><br>
<div id="success"> </div><button type="submit" class="btn btn-primary" onclick="window.location.href = '#portfolio'">Submit
Message</button>
</div>
</form>
<!-- <div class="div_model">
<img id="cropedBigImg0" src="images/0.png" class="div_model_img"/>
<input type="file"class="file" accept="image/gif,image/jpeg, image/png, image/jpg"id="chooseImage0">
</div> -->
<script>
function ProcessFile1(e) {
var src_img = document.getElementById('chooseImage0').files[0];
console.log(src_img);
if (src_img) {
var reader = new FileReader();
reader.onload = function (event) {
var txt = event.target.result;
$("#cropedBigImg0").attr('src', txt);//将图片base64字符串赋值给img的src
//console.log(txt)//base64
};
}
reader.readAsDataURL(src_img);
}
function ProcessFile2(e) {
var tar_img = document.getElementById('chooseImage1').files[0];
console.log(tar_img);
if (tar_img) {
var reader = new FileReader();
reader.onload = function (event) {
var txt = event.target.result;
$("#cropedBigImg1").attr('src', txt);//将图片base64字符串赋值给img的src
//console.log(txt)//base64
};
}
reader.readAsDataURL(tar_img);
}
function contentLoaded0() {
document.getElementById('chooseImage0').addEventListener('change',
ProcessFile1, false);
}
function contentLoaded1() {
document.getElementById('chooseImage1').addEventListener('change',
ProcessFile2, false);
}
// var model=document.getElementById('model');
// var input=model.querySelectorAll('input');
window.addEventListener("DOMContentLoaded", contentLoaded0, false);
window.addEventListener("DOMContentLoaded", contentLoaded1, false);
</script>
</div>
</div>
</div>
</section>

Write Preview
Loading…
Cancel
Save