2015-12-14 14 views
9

Tôi chỉ quen thuộc với HTML và CSS mà tôi sử dụng hàng ngày. !Important Ghi đè CSS là thứ tôi phải làm để TẤN để tùy chỉnh trang web cho khách hàng sử dụng hệ thống CRM của bên thứ ba, nhưng bây giờ tôi đã được hỏi xem liệu tôi có thể ghi đè lên thanh trượt hình ảnh Javascript không; cụ thể là nếu tôi có thể buộc nó cho phép hình ảnh xoay vòng thay vì hiển thị một hình ảnh duy nhất chỉ thay đổi ngẫu nhiên đối với những hình ảnh khác khi trang làm mới. Tôi không quen thuộc với Javascript để biết cách làm điều này; Tôi đã sử dụng cùng một loại thanh trượt hình ảnh này nhiều lần, vì vậy tôi biết cài đặt nào cần được thay đổi, nhưng tôi không biết cách ép buộc ghi đè như tôi làm với CSS hoặc thậm chí nếu có thể một trang khác trên cùng một trang sẽ làm điều đó.Hacking/Overriding Javascript

Đây là đoạn mã javascript mà trang web đã có trên đó.

<script type="text/javascript"> 
    $(document).ready(function() { 
    var randSlick = Math.floor(Math.random() * $('#carousel > div').length); 
    $('#carousel').slick({ 
     infinite: true, 
     autoplay: false, 
     autoplaySpeed: 10000, 
     slidesToShow: 1, 
     slidesToScroll: 1, 
     arrows: false, 
     fade: true 
    }).slickGoTo(randSlick); 
    }); 
</script> 

tôi cần phải thay đổi "autoplay" true, vì vậy nó sẽ chơi tự động thay vì không làm gì cả, và tôi muốn thay đổi "autoplaySpeed" một cái gì đó hợp lý hơn, giống như 3000.

Tôi không có quyền truy cập vào phần này của mã (Do đó tại sao tôi luôn phải thực hiện CSS! Ghi đè quan trọng; Tôi không thể chỉnh sửa mã hiện tại một cách trực tiếp, tôi phải thêm mã của riêng mình vào một thư mục lén lút sắp xếp hoặc cách) vì vậy tôi hy vọng rằng có một cách dễ dàng để làm điều này. Lời xin lỗi của tôi nếu điều này là dài quanh co hoặc khó hiểu trong bất kỳ cách nào; Tôi đã tự dạy HTML và CSS một cách dễ dàng nhưng Javascript đang chứng tỏ là một con vật khác hoàn toàn và tôi chỉ đang vẫy tay vào thời điểm này.

+5

Bạn không thể gọi '$ ('# carousel'). Unslick()' và sau đó bắt đầu lại bằng các cài đặt bạn muốn? – SlashmanX

+0

Vì vậy, bạn không thể chỉ chỉnh sửa mã JavaScript ?? – epascarello

+0

@AGE - Bạn nói đúng, tôi chỉ lướt qua các tài liệu – SlashmanX

Trả lời

4

Để có được rõ ràng ra khỏi con đường:

  1. Bạn sẽ không thể sửa đổi các mã JavaScript với HTML/CSS, bạn chỉ có thể làm như vậy bằng JavaScript.
  2. Những gì bạn thấy trong tập lệnh là JQuery, thư viện tiện ích JavaScript: see: JQuery API.

tôi khuyên bạn nên làm cho kịch bản của riêng bạn để thiết lập lại các giá trị của $("#carousel") qua unslick chức năng, mà là tài liệu rõ ràng ở đây: see: SlickJS.

$("#carousel").slick('unslick'); 

Ngay sau đó bạn có thể ràng buộc $("#carousel") với các thông số của riêng bạn như vậy:

<script type="text/javascript"> 
    $(document).ready(function() { 
    var randSlick = Math.floor(Math.random() * $('#carousel > div').length); 
    $('#carousel').slick({ 
     infinite: true, 
     autoplay: true, 
     autoplaySpeed: 3000, 
     slidesToShow: 1, 
     slidesToScroll: 1, 
     arrows: false, 
     fade: true 
    }).slickGoTo(randSlick); 
    }); 
</script> 

Hãy chắc chắn 100% rằng tập tin JavaScript của bạn được gọi sau nhập khẩu SlickJS.

Mọi câu hỏi? Hãy hỏi ý kiến ​​dưới đây :-)

3

Trong trang của bạn, bạn có thể hủy cấu trúc đối tượng slick hiện tại và tạo lại nó với cài đặt của riêng bạn.

<script type="text/javascript"> 
    $(document).ready(function() { 
    $('#carousel').slick('unslick'); // Destroy existing slick object 
    // Start a new one with the options you want 
    $('#carousel').slick({ 
     autoplay: true, 
     autoplaySpeed: 3000 
    }); 
    }); 
</script> 
+0

Theo tài liệu SlickJS, đối số đúng sẽ là: '$ (" # carousel '). Slick (' unslick '); 'xem tại đây: http://kenwheeler.github.io/slick/ – AGE