Recently, I encountered a problem that has left me puzzled. Despite searching online for help, I have not been able to find a solution. The issue lies with the basic code provided on the official page of the TurnJS script.
<div id="flipbook">
<div class="hard"> Turn.js </div>
<div class="hard"></div>
<div> Page 1 </div>
<div> Page 2 </div>
<div> Page 3 </div>
<div> Page 4 </div>
<div class="hard"></div>
<div class="hard"></div>
Although the code functions properly, there is an issue with the transparency of the background causing text overlap and making it difficult to read.
My attempt to resolve this by adding
#flipbook div{
background: white;
}
has somehow caused further issues, such as skewed pages when hovered over. Unfortunately, I am unable to provide a demo using JSFiddle due to restrictions on linking unsecured HTTP URLs. The distorted page can be seen in the image linked below.
Does anyone know how to add a bg-colorto the flipbook?
Any input would be greatly appreciated.
https://i.sstatic.net/LGFdY.png