ein

Question

mehrfach Grenze des Bildes ändern habe ich eine Website Drupal-7 und ich habe ein Bild:

<img id="blah" src="sites/all/themes/my_theme/test.png" alt="default image" /> 

Was ich will, ist mehrere Grenzen-Frames an, und dann gibt dem Anwender die Möglichkeit, hinzufügen Wählen Sie, welche Grenze er bevorzugt, während Sie jedes Mal sein Bild mit der anderen Grenze anzeigen.
Ist das möglich?

Answer 1

Sie meinen, so etwas wie dieses:

function changeBorder(ele) { 
 
    var classToAdd = ele.value; 
 
    document.getElementById("blah").classList.remove("border1", "border2", "border3", "border4", "border5"); 
 
    document.getElementById("blah").classList.add(classToAdd); 
 
}

.border1{ 
 
    border: 3px coral solid; 
 
} 
 
.border2{ 
 
    border: 4px coral dashed; 
 
} 
 
.border3{ 
 
    border: 5px coral double; 
 
} 
 
.border4{ 
 
    border: 6px coral inset; 
 
} 
 
.border5{ 
 
    border: 7px coral outset; 
 
}

<img id="blah" src="http://placehold.it/150" alt="default image" /><br /> 
 
<button onclick='changeBorder(this)' value='border1'>Border 1</button> 
 
<button onclick='changeBorder(this)' value='border2'>Border 2</button> 
 
<button onclick='changeBorder(this)' value='border3'>Border 3</button> 
 
<button onclick='changeBorder(this)' value='border4'>Border 4</button> 
 
<button onclick='changeBorder(this)' value='border5'>Border 5</button>