onhover更改图像和文本位置向下和onmouseout转到初始位置？

Question

我是否可以知道如何更改图像以及图像中的文字改变其位置？当我悬停图像时，它向下移动，但不是文本。图像工作正常，但不是文本。

小提琴：

h2 { 
   position:fixed; 
  margin-top:40px;
   left: 50; 

   z-index:100;
 height:100%;
}
h2:hover{
  position: relative; 
  margin-top:-50px;
   left: 50; 
}

https://jsfiddle.net/mjLLgce7/1/

请帮帮我。感谢

Answer 1

非常错误的代码，如果没有css样式的一些重大更改，这是不可能的

（我尽量不要碰你的剧本！）

h2 {
margin:0px;
  line-height:none;

}

  a{
  vertical-align:top;
  display:inline-block;
  position: relative; 
 }
 a:hover{
   top:50px;
 }

<script>
function b1(x1) {
    x1.style.height = "140px";
    x1.style.width = "120px";
}

function s1(x2) {
    x2.style.height = "100px";
    x2.style.width = "120px";
}

function b2(x3) {
    x3.style.height = "140px";
    x3.style.width = "120px";
}

function s2(x4) {
    x4.style.height = "100px";
    x4.style.width = "120px";
}

function b3(x5) {
    x5.style.height = "140px";
    x5.style.width = "120px";
}

function s3(x6) {
    x6.style.height = "100px";
    x6.style.width = "120px";
}

function b4(x7) {
    x7.style.height = "140px";
    x7.style.width = "120px";
}

function s4(x8) {
    x8.style.height = "100px";
    x8.style.width = "120px";
}

function b5(x9) {
    x9.style.height = "140px";
    x9.style.width = "120px";
}

function s5(x) {
    x.style.height = "100px";
    x.style.width = "120px";
}

function b6(x12) {
    x12.style.height = "140px";
    x12.style.width = "120px";
}

function s6(x12) {
    x12.style.height = "100px";
    x12.style.width = "120px";
}
</script>


<a href="#">
  <h2>some text1</h2>
  <img onmouseover="b1(this)"  border="0" src="http://newshores.newshores.in/wp-content/uploads/2016/01/why-study.png" onmouseout="s1(this)" alt="study"/>
</a>

<a href="#" class>
  <h2>some text1</h2>
  <img onmouseover="b2(this)" onmouseout="s2(this)" border="0" src="http://newshores.newshores.in/wp-content/uploads/2016/01/graduate.png" alt="graduate"/>
</a>

<a href="#" class>
  <h2>some text1</h2>
  <img onmouseover="b3(this)" onmouseout="s3(this)" border="0" src="http://newshores.newshores.in/wp-content/uploads/2016/01/pg.png" alt="pg" />
</a>

<a href="#" class>
  <h2>some text1</h2>
  <img onmouseover="b4(this)" onmouseout="s4(this)" border="0" src="http://newshores.newshores.in/wp-content/uploads/2016/01/pre-university.png" alt="pre-uni"/>
</a>