как скрыть содержание отделения в CSS
Во-первых: обратный вызов getJSON не возвращает (key, value), он возвращает (parseArray, successString) =>, поэтому ваш цикл не будет работать. Проверьте ниже, возможное решение может быть: -
$.getJSON("https://api.jsonbin.io/b/5c7e2d275fe214587796753b", (data) => {
// $.getJSON callback format returns (data, status)
// so if you get it as (key, value) you will get (Your JSON Array, "success")
// Solution is below
data.forEach((value, key) => {
if(value.programming_class){
// programming class is an array in provided JSON
// you can use static first index as well if it is fixed
// value = value[0] to avoid outer loop;
value.programming_class.forEach((p) => {
// p is not an array
let keys = Object.keys(p);
keys.forEach((k) => {
let classObj = p[k];
console.log(classObj);
// now you can perform actions on this object i-e: sum, multiple whatever
});
});
}
})
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>4 ответа
Without changing the markup or using JavaScript, you'd pretty much have to alter the text color as knut mentions, or set text-indent: -1000em;
IE6 will not read the :hover selector on anything other than an anchor element, so you will have to use something like Dean Edwards' IE7.
Really though, you're better off putting the text in some kind of element (like p or span or a) and setting that to display: none; on hover.
Hiding through CSS is achieved by using either the "visibility" or the "display" attributes. Though both achieve similar results, it's useful to know the differences.
If you only want to hide the element but retain the space occupied by it, you should use:
#mybox:hover {
visibility: hidden;
}
If you want to hide the element and remove the space occupied by it, so that other elements can take its space, then you should use:
#mybox:hover {
display: none;
}
Also remember that IE6 and below do not respond to :hover for anything except A tags. In which case, you'll need some Javascript to change the classname:
document.getElementById('mybox').className = 'hide';
and define the "hide" class in CSS:
.hide { display: none; }
You could make the text color the same as the background color:
#mybox:hover
{
background-color: red;
color: red;
}
#mybox:hover { display: none; }
#mybox:hover { visibility: hidden; }
#mybox:hover { background: none; }
#mybox:hover { color: green; }
though it should be noted that IE6 and below wont listen to the hover when it's not on an A tag. For that you have to incorporate JavaScript to add a class to the div during the hover.