jquery image

Je suis à la recherche pour permettre aux utilisateurs de sélectionner une pré-image téléchargée à un utilisateur de générer la page web.

J'ai une liste des images disponibles, donc j'ai pu facilement le faire avec un contrôle de sélection, cependant, je voudrais vraiment, afin de permettre aux utilisateurs de sélectionner à partir d'une fenêtre pop-up de vignettes, plutôt que du texte, puis remplir un texte de l'élément de formulaire avec le nom de fichier résultant. Je suis en espérant que le résultat final sera comme un calendrier pop-up sélecteur de date.

Je suis sûr qu'il y est une façon simple de le faire à l'aide de Jquery /javascript. Personne ne sait d'une pré construit widget /exemple de cela, ou peut-on me pointer dans la bonne direction par où commencer? Je suis assez nouveau pour Javascript, mais prêts à investir du temps dans l'apprentissage...

Clarification: Une grille ou de liste de vignettes est ce que je suis après idéalement, mais la chose principale est de donner à l'utilisateur une représentation visuelle de l'image, plutôt que son nom de fichier...

Êtes-vous essayer de créer une grille/liste de vignettes? Ou avoir aux utilisateurs de sélectionner à partir d'un <select>? Ou quelque chose de différent?
Je pense qu'il veut quelque chose qui ressemble à un <select> mais au lieu du texte des images comme des options.
Qui est, par ailleurs, une bonne question et quelque chose que je serais curieux de voir.
si vous avez résolu ce problème , pourriez-vous écrire les détails de comment vous l'avez résolu, je suis intéressé par quelque chose de similaire. tnkx

OriginalL'auteur Rob Y | 2009-02-10

  1. 2
    function fillBox(myImg){
    imageSource = myImg.src;
    imgName = //do some stuff to get only the filename, minus the dirs
    document.getElementById("yourTextBox").value = imgName;
}

    et que vous êtes de la génération des vignettes, l'ajouter à la balise img:

    onclick="javascript:fillBox(this);"

    Je n'ai pas testé, mais ça devrait vous obtenez la plupart du chemin.

    Merci pour cette. J'ai fini de l'utiliser en combinaison avec Paulo réponse, m'a aidée à sortir un régal.

    OriginalL'auteur inkedmn

  2. 8

    J'ai été en mesure de trouver ce plugin jQuery appelé "Sélectionner La Zone De L'Usine 2.0"

    Ouvrir les "Autres Caractéristiques: Images de" l'accordéon, et je pense que c'est plus ou moins ce que vous voulez.

    Sinon, vous pourriez faire quelque chose comme:

    <select id='images'>
    <option value='tiger.jpg'>Tiger</option>
    <option value='owl.jpg'>Owl</option>
    <option value='bear.jpg'>Bear</option>
</select>
<div id='preview'></div>

    Et jQuery code comme ceci:

    $('#images').change(function() {
    var image = $(this).val();
    var img = $('<img/>').attr('src', image);
    $('#preview').html(img);
});

    Bonne chance.

    OriginalL'auteur Paolo Bergantino

  3. 1

    J'ai été plutôt impressionné par jQuery personnalisée sélectionnez. Il semblait être un peu lent lors du remplissage des champs.

    OriginalL'auteur Aram Verstegen