Home/ Questions/Q 9193167
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-17T21:05:48+00:00

how to show the image in the small cube rounded corner…. the image in

  • 0

how to show the image in the small cube rounded corner….
the image in the light box is rounded corner….
actual image is here

http://www.defie.co/designerImages/inventoryControl.png

http://jsfiddle.net/ZrpLT/91/

providing my code below

    <script type="text/javascript">
        Gallery.setOptions({
            size:     150,
            lightbox: true,
            //animation:  'drop'
            //speed:      500,
            //closeOnEsc: true,
            //slideshow:  false,
            //slideshow_speed: 3000,
            //cube_speed: 1000
        });
    </script>
    <style>
        body {
            background: #AAAAAA;
        }
    </style>
</head>
<body>
        <div class="row">
            <div class="span10">
                <div class="melonhtml5_gallery">
                                <div data-caption="&lt;a style='margin-left: 92px; font-size: 18px;' href='http://www.w3schools.com/' &gt;Create&lt;/a&gt; &lt;div&gt; &lt;a style='margin-left: 92px; font-size: 18px;' &gt;View/Edit&lt;/a&gt; &lt;/div&gt; &lt;a style='margin-left: 92px; font-size: 18px;' &gt;Labels&lt;/a&gt;" data-image="http://www.defie.co/designerImages/inventoryControl.png"></div>



            </div>
        </div>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    If I understand correctly, you’d like the rotating cube to have rounded corners, similar to the image but in 3D.

    You could sort of give it a rounded corner feel, but because there are layers in the background as the cube rotates, the effect fails.

    div.melonhtml5_gallery div.cube div,
div.melonhtml5_gallery div.cube div img {
    border-radius: 10px;
}

    Here’s a similar attempt at quasi-rounded corners in CSS3: http://3dcube.pixelass.com/

    CSS3 transforms are limited to matrix transformations on 2-dimensional boxes, so creating 3D-looking objects is usually achieved by some clever trick or illusion. In this case, that illusion fails when the corners are rounded. To get a truly rounded rotating cube, I think you’ll have to use something like WebGL.

    • 0