photo_06.html 1.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <title>Photo</title>
  5. <meta http-equiv="Content-type" content="text/html;charset=UTF-8" />
  6. <script src="./js/jquery.min.js"></script>
  7. <style>
  8. body{
  9. margin: 5px;
  10. background-color:rgb(240,240,240);
  11. }
  12. .selectIcon {
  13. width:140px;
  14. height:140px;
  15. float:left;
  16. border: solid 1px #F1F2F4;
  17. background: white;
  18. cursor: pointer;
  19. transition: background 0.5s;
  20. -webkit-transition: background 0.5s;
  21. }
  22. .selectIcon:hover {
  23. background: #8CBBF4;
  24. }
  25. </style>
  26. </head>
  27. <body>
  28. <div style="width:570px;height:150px;border:1px solid;">
  29. <div class="selectIcon" onclick="setHeadIcon('0.png');"><img src="./images/0.png"></div>
  30. <div class="selectIcon" onclick="setHeadIcon('1.png');"><img src="./images/1.png"></div>
  31. <div class="selectIcon" onclick="setHeadIcon('2.png');"><img src="./images/2.png"></div>
  32. <div class="selectIcon" onclick="setHeadIcon('3.png');"><img src="./images/3.png"></div>
  33. </div>
  34. </body>
  35. <script type="text/javascript">
  36. function setHeadIcon(iconName){
  37. window.saveImage(iconName);
  38. }
  39. </script>
  40. </html>