2013-03-29 3 views
0

Хорошо, я знаю, что это можно сделать, поскольку я видел это раньше. Но я понятия не имею, как это сделать, я искал всюду для ответа.Изменить позицию формы на странице load

Что мне нужно для моей формы, чтобы случайным образом менять позиции, когда страница загружается из 3 разных точек на странице. Так, например ....

[Здесь] [Здесь] [Здесь]

Может быть все возможные пятна форма может загружать в систему, но только в 1 месте для каждого времени нагрузок. Я не знаю, какую информацию вам нужно, чтобы помочь мне. Сейчас я просто покажу свою форму.

<form name="inputt" action="" method="post"> 
    <div align="center"> 
    <input type="submit" class="catch" value="Catch Pokemon" name="catch"> 
    </div> 
</form> 

Если вам нужно больше спросить.

+0

Как структурированы это? Вы можете создать сетку возможных местоположений, используя таблицу с '', а затем использовать 'document.getElementById()' или что-то еще. –

ответ

2

Только мои мысли, но вы можете написать CSS для 3-х разных классов позиции и называть их такими, как «position1», «position2», «position3». Затем при загрузке страницы в javascript (или на PHP), если хотите, создайте случайное число от 1 до 3, добавьте класс в элемент "position"+randomNumber, а затем он будет в одном из этих мест. Это похоже на метод, который я использовал для случайных фоновых изображений.

Update

Кроме того, если вы хотите использовать более описательные имена классов для местоположений, вы можете сохранить отображение числа к имени класса (или использовать что-то подобное положение в массиве), чтобы связать случайное число с классом.

Код

CSS:

<style> 
    .position1 { 
     // Whatever style you want for position 1 
    } 
    .position2 { 
     // Whatever style you want for position 2 
    } 
    .position3 { 
     // Whatever style you want for position 3 
    } 
</style> 

JS:

$(document).ready(function() { 
    var randomIndex = Math.floor(Math.random()*3)+1; //3 is the number of options you have; +1 makes the range 1 - 3 instead of 0 - 2 
    $('#my-form').addClass('position'+randomIndex); //Adds the new class the element with id = 'my-form' 
} 
+0

Это звучит как моя лучшая ставка на этот вопрос из-за моих ограниченных возможностей кодирования, но я все еще немного потерял в этом вопросе, как вы думаете, давая мне какой-то пример того, что вы имеете в виду? жаль, что я действительно новичок в этом. – Sakai

+0

Я дал вам быстрый код для этого в javascript. Обратите внимание, что я использую jQuery. Если вы этого не сделаете, не так уж сложно использовать собственный javascript, чтобы делать то же самое. Я бы также рекомендовал добавить в форму тег 'id', чтобы было легче выбрать. –

+0

Большое спасибо, поэтому мне нужно преобразовать код js, который вы мне дали, чтобы работать с моим кодом, так как я не использую jquery? – Sakai

0

Если вы хотите сказать «загрузить» обновить страницу, то вам нужно будет сохранить прежнее расположение формы в cookie или каком-либо другом механизме. На основании последнего местоположения формы вы можете решить, какое место должно быть следующим.

Если форма перезагружается на основе вызовов ajax, то я бы посоветовал использовать var для хранения предыдущего местоположения формы и сделать следующее местоположение не таким же, как предыдущее, проверив значение var. Если каждая позиция загрузки формы времени должна быть уникальной, чем использовать массив для хранения ранее используемых мест отображения.

HTH.

Смежные вопросы