我正在为网页上的图片添加图片。图片显示在侧面,我不确定该如何翻转。关于如何翻转它的任何建议。我包含了用于提供尽可能多信息的HTML和JavaScript。
$(document).ready(function(){
$("button").click(function(){
$("p").toggle();
});
});
<!DOCTYPE HTML>
<html lang="en">
<title>Homeroom GPA Calculatiion: Step 1</title>
<meta charset="utf-8">
<head>
<link rel="stylesheet" href="hayes_java_project.css">
<script src="gpa_calculation.js"></script>
<script src="http://code.jquery.com/jquery-3.1.1.min.js"></script>
</head>
<!-- Nav -->
<nav>
<ul class="links">
<li><a href="hayes_java_project.html">Home: GPA Calculation Tutorial</a></li>
<li><a href="project_why.html"> Why Calculate your GPA?</a></li>
<li><a href="project_step_1.html">Step 1: Document Your Grades</a></li>
<li><a href="project_step_2.html">Step 2: Convert Grade Percentages to GPA Points</a></li>
<li><a href="project_step_3.html">Step 3: Average GPA Point Total to Get GPA</a></li>
<li><a href="project_step_4.html">Step 4: Submit GPA for Teachers</a></li>
</ul>
</nav>
<h1>HHHS Homeroom GPA Calculation: Step 1</h1>
<h2>Document Your Grades</h2>
<p>For this step, you will need your paper and writing utensil. Go to HomeAccess through the CPS portal and write down your 7 classes (not including homeroom) with the percentage of your current grade. See example below. </p>
<body>
<button>Examples of Step 1 Here.</button>
<p>Write down all classes. <img src="example1.png" alt="Write Down all of your current classes on paper" height="400" width="300" class="center"></p>
<p>Document percentage points for each. <img src="example1.png" alt="Write Down all of your current classes on paper" height="400" width="300" class="center"></p>
</body>
<footer><small><i>Page created by Samantha Hayes.<br>
Copyright © 2018 <br>
Please <a href="mailto:shayes@cpsk12.org">e-mail</a> me with any questions.<br>
Last updated on December 2018. </i></small>
</footer>
<p>
</html>
答案 0 :(得分:1)
我将在编辑器中旋转实际图像,但是如果必须使用JavaScript或CSS进行操作,则可以使用。
$('.the-flipped-image').css('transform', 'rotate(90deg)')
或
.the-flipped-image{
transform: rotate(90deg);
}
您可以根据需要翻转的值来更改该值。请记住,它也可以是负值。