comment construire un curseur triangulaire?

-2

Bon après-midi!comment construire un curseur triangulaire?

J'ai un design slider triangulaire mais pas HTML: triangular slider design at the bottom

Comment ça fonctionne:

si vous passez la souris sur une diapositive (une triagle) la lame grows a bit like this
si vous cliquez dessus une boîte à lumière ouvre
si vous cliquez sur les flèches gris suivant/précédent un autre ensemble de 6 images apparaît

J'ai essayé d'utiliser

CSS frontière-triangles + frontière image
rotation des images de triangle individuelles avant et leur conteneur arrière
tag carte pour vol stationnaire et cliquez sur

mais pas de vraie solution. J'apprécie l'aide de quelqu'un.

Source

2013-06-13 Szépe Viktor

Quelle est votre question? Plus important encore: [* qu'avez-vous essayé? *] (Http://whathaveyoutried.com) – zzzzBov

Merci pour la question. C'est mon premier. –

@ SzépeViktor Veuillez relire sa question. Nous ne savons pas ce que vous demandez. Quel est le but? quelle est la demande – ntgCleaner

ce que vous voulez faire est possible via CSS3.
Il doit être fait en pensant, que ce ne sera pas des triangles pour les anciens navigateurs.
Ainsi, vous commencez par construire votre curseur en forme carrée. La deuxième partie est de faire tourner carrés, cacher la moitié, et ....

j'ai copié un de mes dabblet dans liveweave.com, vous pouvez l'ouvrir dans IE8 si vous le souhaitez: http://liveweave.com/UU2oOZ

ce n'est pas votre solution, ce menu est vertical), mais c'est un exemple qui peut vous aider à démarrer quelque chose.

Source

2013-06-13 18:43:45

quelques-uns de mes dabbets avec triangle: dabblet.com/gist/3482088, dabblet.com/gist/5020696, dabblet.com/gist/5190765. Le truc, c'est de voir comment ça se passe si CSS3 échoue. –

Est-ce que vous essayez d'avoir tout le parallélogramme qui glisse d'avant en arrière, ou les images de triangle individuelles? Peut-être que si vous avez un exemple de ce à quoi ressemblerait la diapositive suivante, ce serait utile.

Source

2013-06-13 18:08:52 user2483354

comme je l'ai édité ci-dessus: prev/diapositives suivantes toutes les 6 images, en cliquant sur une image ouvre une lightbox –

Si le lien ci-dessus correspond à ce que vous recherchez, vous pouvez également utiliser des png transparents qui sont déjà en forme de triangle, puis utiliser le positionnement absolu pour faire se chevaucher les éléments. Ce n'est pas aussi élégant que l'utilisation de CSS3, mais c'est une solution universelle pour le support du navigateur. Je pense que nous avons besoin de plus de détails sur ce que vous souhaitez accomplir.

Source

2013-06-13 20:03:38 user2483354

Merci! Je demande ici parce que j'ai besoin d'une solution élégante. –

comment construire un curseur triangulaire?

Répondre

Questions connexes