按钮点击更新多功能图像上的图像源

时间:2015-08-04 09:51:15

标签: jquery html css toggle

我想在点击按钮上更改可变图像

images

我试过这个,但只能更新1张图片

public class MarkerInfoWindowAdapter implements GoogleMap.InfoWindowAdapter
{
    public MarkerInfoWindowAdapter(Bitmap pbitMap){}

    @Override
    public View getInfoWindow(Marker marker)
    {
        ArrayList<String> lPhotos = new ArrayList();
        File file=new File("/sdcard/trip/");
        File[] list = file.listFiles();
        int count = 0;
        String lname = "";
        for (File f: list){
            lname = f.getName();
            if (lname.endsWith(".jpg")){
                count++;
                lPhotos.add(lname);
            }
            System.out.println("170 " + count);
        }
        Bitmap mBitmap = getImageFileFromSDCard(lname);
        View v  = getLayoutInflater().inflate(R.layout.infowindow_layout, null);
        ImageView markerIcon = (ImageView) v.findViewById(R.id.marker_icon);
        markerIcon.setImageBitmap(mBitmap);
        return v;
     }

    @Override
    public View getInfoContents(Marker marker)
    {
        View v  = getLayoutInflater().inflate(R.layout.infowindow_layout, null);
        ImageView markerIcon = (ImageView) v.findViewById(R.id.marker_icon);

        return v;
    }
}

我希望他们在点击btn1时切换回来,所以基本上是一个切换功能

非常感谢提前

******更新*********

codepen

1 个答案:

答案 0 :(得分:0)

这可能是您的解决方案。

Fiddle

&#13;
&#13;
$("#box1").click(function() {
  $(this).toggleClass("switch1");
});
$("#box2").click(function() {
  $(this).toggleClass("switch2");
});
&#13;
#box1 {
  width: 200px;
  height: 200px;
  background: url("http://www.musicmatters.ie/images/bara4.jpg") no-repeat;
  background-size: contain;
}
.switch1 {
  background: url("http://www.musicmatters.ie/images/bara3.jpg") no-repeat!important;
  background-size: contain!important;
  width: 200px!important;
  height: 200px!important;
}
#box2 {
  width: 200px;
  height: 200px;
  background: url("http://www.musicmatters.ie/images/volunteer1.jpg") no-repeat;
  background-size: contain;
}
.switch2 {
  background: url("http://www.musicmatters.ie/images/volunteer2.jpg") no-repeat!important;
  background-size: contain!important;
  width: 200px!important;
  height: 200px!important;
}
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<div id="box1">

  &nbsp;

</div>

<div id="box2">

  &nbsp;

</div>
&#13;
&#13;
&#13;

相关问题